ホームページ > ウェブフロントエンド > jsチュートリアル > Jqueryフォーム検証クラスの紹介とexamples_jquery

Jqueryフォーム検証クラスの紹介とexamples_jquery

WBOY
リリース: 2016-05-16 17:32:36
オリジナル
955 人が閲覧しました

[html]

复制代码代码如下:


数值:

浮点タイプ:

和文:

大写文:

小写文:

邮件格式:

中国語が含まれているかどうか:

URL:

電话号番号:

IP アドレス:

金额:

数值または英文または者_:

邮政编码:

使用可能な番号:

QQ:

身份证:

数值允许は空:

数值長度 1-3:

数值 長度 1-3 允许は空:







[javascript]
复制代码代码如下:

/*
* ユニバーサル JS 検証クラス
* 使用法:
* var formValidate = new formValidate();
* formValidate.init({});注:
*

* id は formValidate
*
*
* validate="zip_code" 郵便番号かどうかを確認します
* empty ="yes" 空が許可されているかどうかを確認します
* min=10 最小長
* max=10 最大長
* プロンプトの内容を表示します
*/
var formValidate = function () {

var _this = this;

this.options = {
number : {reg : /^[0-9] $/, str : '数値である必要があります'},
10 進数 : {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 : 'メールの形式が正しくありません'},
中国語 : {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 : '英字、数字、_ のみが使用できます入力する必要があります'},
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('')
}
; }
}

//属性の min と max の最大長と最小長
var min = null;
var max = null; 'min')) min = child.attr(' min');
if (child.attr('max')) max = child.attr('max'); {
if (len < min || len > max) {
if (childSpan) {
childSpan.html('');
childSpan.html(' 文字列の長さは次のとおりです' min ' および ' max ');
testResult = false;
}
}
} else if (min) {
if (len if (childSpan) {
childSpan.html('');
childSpan.html(' 文字列の長さは ' min より大きい必要があります);
testResult = false; 🎜>}
}
} else if (max) {
if (len > max) {
if (childSpan) {
childSpan.html(''); childSpan.html(' 文字列の長さは ' max 未満である必要があります);
testResult = false
}
}

// 通常の検証
if (child.attr('validate' )) {
var type = child.attr('validate');
var result = _this.check(value, type); childSpan) {
childSpan.html('' );
if (result != true) {
childSpan.html(' ' result);
testResult = false; >}
}

});
return testResult;

//1 つの通常のオプションを検出します。 check = function (value, type) {
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 までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート