jQuery 검증:정규식 유효성 검사를 위한 규칙을 추가하는 방법은 무엇입니까?
저는 jQuery validation plugin을 사용하고 있습니다.멋진 물건!기존 ASP를 마이그레이션하고 싶습니다.ASP 대신 jQuery를 사용하는 NET 솔루션.NET 검증자.정규식 검증기를 교체할 사람이 없습니다.저는 이런 일을 할 수 있기를 원합니다.
$("Textbox").rules("add", { regularExpression: "^[a-zA-Z'.\s]{1,40}$" })
이를 위해 사용자 지정 규칙을 추가하려면 어떻게 해야 합니까?
빨간색 사각형의 답변 덕분에 다음과 같은 방법을 추가했습니다.
$.validator.addMethod(
"regex",
function(value, element, regexp) {
var re = new RegExp(regexp);
return this.optional(element) || re.test(value);
},
"Please check your input."
);
이제 정규 모델에 대해 검증하기 위해 필요한 작업은 다음과 같습니다.
$("#Textbox").rules("add", { regex: "^[a-zA-Z'.\\s]{1,40}$" })
라는 것 .additional-methods.js n"다일 수다"를 합니다.법.RegExp따옴표 없이 메소드를 사용하여 생성된 경우.
편집
pattern기능은 이제 이를 수행하는 데 선호되는 방법이며, 예를 들어 다음과 같습니다.
$("#Textbox").rules("add", { pattern: "^[a-zA-Z'.\\s]{1,40}$" })
addMethod()를 사용할 수 있습니다.
예
$.validator.addMethod('postalCode', function (value) {
return /^((\d{5}-\d{4})|(\d{5})|([A-Z]\d[A-Z]\s\d[A-Z]\d))$/.test(value);
}, 'Please enter a valid US or Canadian postal code.');
좋은 기사 여기 https://web.archive.org/web/20130609222116/http ://www.randallmorey.com/blog/2008/mar/16/extending-jquery-form-validation-plugin/
jQuery 정규식 검증기를 만드는 데 어려움을 겪었지만, 작동하게 되었습니다.여기 완전한 작동 예가 있습니다.jQuery Validation 플러그인에서 찾을 수 있는 'Validation' 플러그인을 사용합니다.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script src="http://YOURJQUERYPATH/js/jquery.js" type="text/javascript"></script>
<script src="http://YOURJQUERYPATH/js/jquery.validate.js" type="text/javascript"></script>
<script type="text/javascript">
$().ready(function() {
$.validator.addMethod("EMAIL", function(value, element) {
return this.optional(element) || /^[a-zA-Z0-9._-]+@[a-zA-Z0-9-]+\.[a-zA-Z.]{2,5}$/i.test(value);
}, "Email Address is invalid: Please enter a valid email address.");
$.validator.addMethod("PASSWORD",function(value,element){
return this.optional(element) || /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,16}$/i.test(value);
},"Passwords are 8-16 characters with uppercase letters, lowercase letters and at least one number.");
$.validator.addMethod("SUBMIT",function(value,element){
return this.optional(element) || /[^ ]/i.test(value);
},"You did not click the submit button.");
// Validate signup form on keyup and submit
$("#LOGIN").validate({
rules: {
EMAIL: "required EMAIL",
PASSWORD: "required PASSWORD",
SUBMIT: "required SUBMIT",
},
});
});
</script>
</head>
<body>
<div id="LOGIN_FORM" class="form">
<form id="LOGIN" name="LOGIN" method="post" action="/index/secure/authentication?action=login">
<h1>Log In</h1>
<div id="LOGIN_EMAIL">
<label for="EMAIL">Email Address</label>
<input id="EMAIL" name="EMAIL" type="text" value="" tabindex="1" />
</div>
<div id="LOGIN_PASSWORD">
<label for="PASSWORD">Password</label>
<input id="PASSWORD" name="PASSWORD" type="password" value="" tabindex="2" />
</div>
<div id="LOGIN_SUBMIT">
<input id="SUBMIT" name="SUBMIT" type="submit" value="Submit" tabindex="3" />
</div>
</form>
</div>
</body>
</html>
정규식을 문자열로 정의할 이유가 없습니다.
$.validator.addMethod(
"regex",
function(value, element, regexp) {
var check = false;
return this.optional(element) || regexp.test(value);
},
"Please check your input."
);
그리고.
telephone: { required: true, regex : /^[\d\s]+$/, minlength: 5 },
이런 식으로 하는 게 낫죠, 안 그래요?
Peter The Nice Guy의 답변을 약간 확장합니다.
$.validator.addMethod(
"regex",
function(value, element, regexp) {
if (regexp.constructor != RegExp)
regexp = new RegExp(regexp);
else if (regexp.global)
regexp.lastIndex = 0;
return this.optional(element) || regexp.test(value);
},
"Please check your input."
);
이렇게 하면 규칙에 regex 개체를 전달할 수 있습니다.
$("Textbox").rules("add", { regex: /^[a-zA-Z'.\s]{1,40}$/ });
lastIndex합니다.g- 에 이 되어 있습니다.RegExp물건. 않으면 마지막 합니다.그렇지 않으면 제목 문자열이 다르더라도 해당 정규성과의 마지막 일치 위치에서 유효성 검사를 시작합니다.
제가 생각한 다른 아이디어는 정규분포 배열을 사용할 수 있게 하는 것이었고, 정규분포의 부정을 위한 또 다른 규칙은 다음과 같습니다.
$("password").rules("add", {
regex: [
/^[a-zA-Z'.\s]{8,40}$/,
/^.*[a-z].*$/,
/^.*[A-Z].*$/,
/^.*[0-9].*$/
],
'!regex': /password|123/
});
하지만 그것들을 실행하는 것은 무리일 수 있습니다.
addMethod 설명서에 언급된 바와 같이:
참고:값에 대한 매개 변수를 확인하는 regex 방법을 추가하는 것이 유혹적이지만, 이러한 정규식을 자신의 방법 안에 캡슐화하는 것이 훨씬 더 깔끔합니다.약간 다른 식이 많이 필요한 경우에는 공통 모수를 추출해 보십시오.정규 표현식 라이브러리 : http://regexlib.com/DisplayPatterns.aspx
예, 정규식마다 방법을 추가해야 합니다.오버헤드는 최소화되지만 정규화 자체를 반복해서 복제하지 않고 정규화된 이름(낮추지 않도록), 기본 메시지(핸디) 및 다양한 장소에서 재사용할 수 있는 기능을 제공할 수 있습니다.
이렇게 할 수 있게 됐어요
$.validator.addMethod(
"regex",
function(value, element, regexp) {
return this.optional(element) || regexp.test(value);
},
"Please check your input."
);
$(function () {
$('#uiEmailAdress').focus();
$('#NewsletterForm').validate({
rules: {
uiEmailAdress:{
required: true,
email: true,
minlength: 5
},
uiConfirmEmailAdress:{
required: true,
email: true,
equalTo: '#uiEmailAdress'
},
DDLanguage:{
required: true
},
Testveld:{
required: true,
regex: /^[0-9]{3}$/
}
},
messages: {
uiEmailAdress:{
required: 'Verplicht veld',
email: 'Ongeldig emailadres',
minlength: 'Minimum 5 charaters vereist'
},
uiConfirmEmailAdress:{
required: 'Verplicht veld',
email: 'Ongeldig emailadres',
equalTo: 'Veld is niet gelijk aan E-mailadres'
},
DDLanguage:{
required: 'Verplicht veld'
},
Testveld:{
required: 'Verplicht veld',
regex: '_REGEX'
}
}
});
});
정규식이 다음 사이에 있는지 확인합니다./:-)
파일에 정의된 내용을 사용할 수 있습니다.이 additional-methods.js 파일은 jQuery Validate dependency 뒤에 포함되어야 합니다. 그러면 그냥 을 사용할 수 있습니다.
$("#frm").validate({
rules: {
Textbox: {
pattern: /^[a-zA-Z'.\s]{1,40}$/
},
},
messages: {
Textbox: {
pattern: 'The Textbox string format is invalid'
}
}
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/additional-methods.min.js"></script>
<form id="frm" method="get" action="">
<fieldset>
<p>
<label for="fullname">Textbox</label>
<input id="Textbox" name="Textbox" type="text">
</p>
</fieldset>
</form>작동 코드입니다.
function validateSignup()
{
$.validator.addMethod(
"regex",
function(value, element, regexp)
{
if (regexp.constructor != RegExp)
regexp = new RegExp(regexp);
else if (regexp.global)
regexp.lastIndex = 0;
return this.optional(element) || regexp.test(value);
},
"Please check your input."
);
$('#signupForm').validate(
{
onkeyup : false,
errorClass: "req_mess",
ignore: ":hidden",
validClass: "signup_valid_class",
errorClass: "signup_error_class",
rules:
{
email:
{
required: true,
email: true,
regex: /^[A-Za-z0-9_]+\@[A-Za-z0-9_]+\.[A-Za-z0-9_]+/,
},
userId:
{
required: true,
minlength: 6,
maxlength: 15,
regex: /^[A-Za-z0-9_]{6,15}$/,
},
phoneNum:
{
required: true,
regex: /^[+-]{1}[0-9]{1,3}\-[0-9]{10}$/,
},
},
messages:
{
email:
{
required: 'You must enter a email',
regex: 'Please enter a valid email without spacial chars, ie, Example@gmail.com'
},
userId:
{
required: 'Alphanumeric, _, min:6, max:15',
regex: "Please enter any alphaNumeric char of length between 6-15, ie, sbp_arun_2016"
},
phoneNum:
{
required: "Please enter your phone number",
regex: "e.g. +91-1234567890"
},
},
submitHandler: function (form)
{
return true;
}
});
}
우리는 주로 jquery validation plugin의 마크업 표기를 사용하고 게시된 샘플들은 우리에게 작동하지 않았습니다. 예를 들어 플래그들이 regex에 존재할 때.
<input type="text" name="myfield" regex="/^[0-9]{3}$/i" />
그러므로 우리는 다음의 토막글을 사용합니다.
$.validator.addMethod(
"regex",
function(value, element, regstring) {
// fast exit on empty optional
if (this.optional(element)) {
return true;
}
var regParts = regstring.match(/^\/(.*?)\/([gim]*)$/);
if (regParts) {
// the parsed pattern had delimiters and modifiers. handle them.
var regexp = new RegExp(regParts[1], regParts[2]);
} else {
// we got pattern string without delimiters
var regexp = new RegExp(regstring);
}
return regexp.test(value);
},
"Please check your input."
);
물론 이제는 이 코드를 위의 코드 중 하나와 결합하여 RegExp 개체를 플러그인에 전달할 수 있지만, 필요하지 않았기 때문에 독자를 위해 이 연습을 남겨두었습니다 ;-).
PS: https://github.com/jzaefferer/jquery-validation/blob/master/src/additional/pattern.js 이라는 번들 플러그인도 있습니다.
이것은 검증 규칙 중 하나인 저에게 효과가 있었습니다.
Zip: {
required: true,
regex: /^\d{5}(?:[-\s]\d{4})?$/
}
도움이 되길 바랍니다.
$.validator.methods.checkEmail = function( value, element ) {
return this.optional( element ) || /[a-z]+@[a-z]+\.[a-z]+/.test( value );
}
$("#myForm").validate({
rules: {
email: {
required: true,
checkEmail: true
}
},
messages: {
email: "incorrect email"
}
});
이거 먹어봤어요?
$("Textbox").rules("add", { regex: "^[a-zA-Z'.\\s]{1,40}$", messages: { regex: "The text is invalid..." } })
참고: ur regex의 모든 "\"를 탈출하기 위해 ur regex 앞에 다른 "\"를 추가하면 regex는 예상대로 작동하지 않습니다.
언급URL : https://stackoverflow.com/questions/280759/jquery-validate-how-to-add-a-rule-for-regular-expression-validation
'source' 카테고리의 다른 글
| Eclipse CDT "Symbol NULL을 확인할 수 없습니다." (0) | 2023.09.24 |
|---|---|
| !! c 연산자, 2개면 안되나요? (0) | 2023.09.24 |
| archive.php 대신 index.php를 사용한 워드프레스 (0) | 2023.09.24 |
| 안드로이드:View.setID(intid)를 프로그래밍 방식으로 - ID 충돌을 방지하는 방법은? (0) | 2023.09.24 |
| Android용 새 Intel 에뮬레이터 실행 (0) | 2023.09.24 |