jQuery.Validate 사용 참고 사항(jQuery 유효성 검사 예)_jquery

유효성 검사 작업 클래스 formValidatorClass.js

코드 복사 코드는 다음과 같습니다.

/**
* @author ming
*/
$(document).ready(function(){
/**//* 기본 속성 설정*/
$.validator.setDefaults({
submitHandler: function(form) {
form.submit();
}
});
// 문자 유효성 검사
jQuery.validator.addMethod("stringCheck", function(value, element) {
return this.ional (element) || /^[u0391-uFFE5w] $/.test(value);
}, "한자, 영문자, 숫자, 밑줄만 포함할 수 있습니다."); 한자 Byte
jQuery.validator.addMethod("byteRangeLength", function(value, element, param) {
var length = value.length;
for(var i = 0; i < value. length ; i ){
if(value.charCodeAt(i) > 127){
length
}
}
return this.ional(element) || = param[0] && length <= param[1] )
}, "입력한 값은 3~15바이트(한자 1개는 2바이트로 계산)인지 확인하세요."); /신분증 번호 확인
jQuery.validator.addMethod("isIdCardNo", function(value, element) {
return this.ional(element) || isIdCardNo(value);
}, "를 입력하세요. ID 번호를 올바르게 입력하세요");
//휴대폰 번호 확인
jQuery.validator.addMethod("isMobile", function(value, element) {
var length = value.length;
var mobile = /^(((13[0-9]{1})|(15[0-9]{1})) d{8})$/
return this.ional(element ) || (length == 11 && mobile.test(value))
}, "휴대폰번호를 정확하게 입력해주세요.")
// 전화번호 확인
jQuery.validator.addMethod( "isTel ", function(value, element) {
var tel = /^d{3,4}-?d{7,9}$/; //전화번호 형식 010-12345678
이것을 반환합니다. 선택 사항( element) || (tel.test(value));
}, "전화번호를 정확하게 입력해주세요.")
//연락처(휴대폰/전화 가능) 확인
jQuery . validator.addMethod("isPhone", function(value,element) {
var length = value.length;
var mobile = /^(((13[0-9]{1})|(15 [ 0-9]{1})) d{8})$/;
var tel = /^d{3,4}-?d{7,9}$/
return this.선택 사항( element) || (tel.test(value) || mobile.test(value));
}, "연락처를 정확하게 입력해주세요.")
// 우편번호 확인
jQuery . validator.addMethod("isZipCode", function(value, element) {
var tel = /^[0-9]{6}$/;
return this.ional(element) || (tel.test (값));
}, "우편번호를 정확하게 입력해주세요.")
//확인 시작
$('#submitForm').validate({
/**//* 유효성 검사 규칙 설정*/
규칙: {
사용자 이름: {
필수:true,
stringCheck:true,
byteRangeLength:[3,15]
},
이메일: {
필수:true,
이메일:true
},
전화:{
필수:true,
isPhone:true
},
주소:{
required:true,
stringCheck:true,
byteRangeLength:[3,100]
}
},
/**//* 오류 메시지 설정*/
메시지: {
사용자 이름 : {
필수: "사용자 이름을 입력하세요.",
stringCheck: "사용자 이름에는 중국어, 영문자, 숫자, 밑줄만 사용할 수 있습니다.",
byteRangeLength: "사용자 이름은 3~3자 사이여야 합니다. 15자(한자 1자는 2자로 간주)"
},
이메일:{
필수: "이메일 주소를 입력하세요.",
이메일: "유효한 이메일 주소를 입력하세요."
},
phone:{
필수: "연락처 번호를 입력하세요.",
isPhone: "유효한 연락처를 입력하세요."
},
주소:{
필수: "연락처 주소를 입력하세요.",
stringCheck: "연락처 주소를 올바르게 입력하세요.",
byteRangeLength: "연락처를 입력해 주세요."
}
} ,
/**//* 확인 트리거 이벤트 설정*/
focusInvalid: false,
onkeyup: false,
/**//* 오류 메시지 프롬프트 DOM 설정*/
errorPlacement: 함수(오류, 요소) {
error.appendTo( element.parent());
},
})


테스트 페이지 색인

코드 복사 코드는 다음과 같습니다.

"http://www.w3.org/TR/html4/loose.dtd"> ;

<머리>








<본문>

<필드세트>

表单验证

사용 이름
*

이메일
*

联系电话
*

地址
*

校验规则参数
格式为; name:{rule1, rule2 ....} name 要使用input 标签的name， 之前，错误理解为 ID 了;
提示信息使用 Alert 输流:

复aze代码 代码如下:

errorPlacement: function (error, element) {
if (error[0].textContent){
Alert (오류[0].textContext);
}
else {
Alert(error[0].innerText);
}
}

성명：

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.