> 웹 프론트엔드 > JS 튜토리얼 > Jquery 양식 유효성 검사 클래스 소개 및 example_jquery

Jquery 양식 유효성 검사 클래스 소개 및 example_jquery

WBOY
풀어 주다: 2016-05-16 17:32:36
원래의
947명이 탐색했습니다.

[html]

复代码 代码如下:


数值:

浮点型:

한국어:

大写英文:

小写英文:

邮件格式:

是否包含中文:

URL:

电话号码:

IP地址:

金额:

数值或者英文或者_:

邮政编码:

可用账号:

QQ:

身份证:

数值 允许为空:

数值 长degree 1-3:

数值 长degree 1-3 允许为공간:







[javascript]
复代码 代码如下:

/*
* 범용 JS 유효성 검사 클래스
* 사용법:
* var formValidate = new formValidate()
* formValidate.init({})
* 참고:
*

* id는 formValidate입니다
*
*
* verify="zip_code" 우편번호인지 확인하세요
* 공백 ="yes" 공백이 허용되는지 확인
* min=10 최소 길이
* max=10 최대 길이
* 프롬프트 내용 표시
*/
var formValidate = function () {

var _this = this;

this.options = {
number : {reg : /^[0-9] $/, str : '숫자여야 합니다.'},
decimal : {reg : /^[-]{0,1}(d )[.] (d )$/ , str : 'DECIMAL 형식이어야 합니다.'},
english : {reg : /^[A-Za-z] $/, str : '영문이어야 함'},
upper_english : {reg : /^[A-Z] $/, str : '반드시 영문자여야 함' 영문 대문자여야 함'},
lower_english : {reg : /^[a-z] $/, str : '영문 소문자여야 함'},
email : {reg : /^([a- zA-Z0-9 ] [_|_|.]?)*[a-zA-Z0-9] @([a-zA-Z0-9] [_|_|.]?)*[a-zA -Z0-9] .[a-zA-Z]{2,3}$/, str : '이메일 형식이 잘못되었습니다.'},
chinese : {reg : /[u4E00-u9FA5uf900-ufa2d]/ig, str : '중국어를 포함해야 합니다.'},
url : {reg : /^[a-zA-z] ://[^s]*/, str : 'URL 형식이 잘못되었습니다.'},
phone : {reg : / ^[1][3][0-9]{9}$/ , str : '전화번호 형식이 잘못되었습니다.'},
ip : {reg : /^(d ).(d ).(d ) .(d )$/ , str : 'IP 주소 형식이 잘못되었습니다.'},
money : {reg : /^[0-9] [.][0-9]{0,3 }$/ , str : '금액 형식이 잘못되었습니다'},
number_letter : {reg : /^[0-9a-zA-Z_] $/ , str : '영문, 숫자, _만 허용됩니다. to be enter'},
zip_code : {reg : /^[a-zA-Z0-9 ]{3,12}$/ , str : '우편번호 형식이 잘못되었습니다.'},
account : { reg : /^[a-zA-Z ][a-zA-Z0-9_]{4,15}$/ , str : '계정 이름이 잘못되었습니다. 5~16자, 문자, 밑줄, 숫자가 허용됩니다.' },
qq : {reg : /[1 -9][0-9]{4,}/ , str : 'QQ 계정이 올바르지 않습니다'},
card : {reg : /^(d{ 6})(18|19|20)?(d {2})([01]d)([0123]d)(d{3})(d|X)?$/ , str : 'ID 번호는 다음과 같습니다. 부정확함'},
};

//바인딩된 양식 옵션 초기화
this.init = function (options) {
this.setOptions(options); );
};

//매개변수 설정
this.setOptions = function (options) {
for (옵션의 var 키) {
if (this.options의 키) ) {
this.options[key] = options[key];
}
}
};

//양식이 비어 있는지 여부, 최대값 및 최소값 감지, 정기 검증
this.checkForm = function ( ) {
$("#formValidate").submit(function () {
var formChind = $("#formValidate").children();
var testResult = true;
formChind.each(function (i) {
var child = formChind.eq(i);
var value = child.val();
var len = value .length;
var childSpan = child.next()

//속성이 비어 있는지 여부
if (child.attr('empty')) {
if (child. attr('empty') == ' yes' && value == '') {
if (childSpan) {
childSpan.html('')
}
return; }
}

//속성에서 min 및 max의 최대 및 최소 길이
var min = null
var max = null; 'min')) min = child.attr(' min');
if (child.attr('max')) max = child.attr('max')
if (min && max) {
if (len max) {
if (childSpan) {
childSpan.html('')
childSpan.html(' 문자열 길이는 다음과 같습니다. 'min' 및 'max');
testResult = false
return
}
}
} else if (min) {
if (len < min)
if (childSpan) {
childSpan.html('');
childSpan.html(' 문자열 길이는 ' min)보다 커야 합니다.
testResult =
return; 🎜>}
}
} else if (최대) {
if (len > max) {
if (childSpan) {
childSpan.html(''); childSpan.html(' 문자열 길이는 ' max);
testResult = false
return;
}
}

//정기 확인
if (child.attr('validate' )) {
var type = child.attr('validate')
var result = _this.check(value, type)
if ( childSpan) {
childSpan.html('' );
if (result != true) {
childSpan.html(' ' result)
testResult = false; >}
}

});
return testResult;
})
}//단일 일반 옵션 감지
check = 함수(값, 유형) {
if (this.options[type]) {
var val = this.options[type]['reg']
if (!val.test( value)) {
return this.options[type ]['str'];
return true;
} else {
return '양식 유효성 검사 일반 항목을 찾을 수 없습니다.' ;
}
}


}

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿