ホームページ >ウェブフロントエンド >jsチュートリアル >jquery validate.js フォーム validation_jquery の基本的な使い方を始める
jquery validate.js フォーム validation_jquery の基本的な使い方を始める
- WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBオリジナル
- 2016-05-16 18:27:371054ブラウズ
先輩が書いた記事を、記録のみを目的として、私自身の理解に基づいて修正し、ここに転載します。
まず国内大手企業のコードを投稿します:
コードをコピー コードは次のとおりです:
javascript">
$( document).ready(function() {
$("#loginForm").validate({
ルール: {
uEmail: {
必須: true 、
メール: true
}、
uPassword: {
必須: true、
rangelength: [6, 30]
}
}、
メッセージ: {
uEmail: {
必須: lang('ls_input_myb'),
email: lang('ls_myb_email')
},
uPassword: {
必須: lang('ls_login_password' ),
rangelength: $.format(lang('ls_password_length'))
}
},
errorPlacement: function(error, element) {
var placement = $(element.parent) ("td").parent(" tr").next("tr").find("td").get(1));
placement.text(''); (配置);
onkeyup: false
});
var accountTipsText = lang("#uEmail"); {
if (!$( $(this).parent().parent().next().find('td').get(1)).text()) {
$($ (this).parent().parent ().next().find('td').get(1)).html('' accountTipsText ' ');
}
$(this).css('color', '#000')
}).focus()
}); ;
実際、このコードには jquery.validate.js の本質がほぼ含まれています。
以前、先物ウェブページのオンラインシミュレーションをしていたとき、自分でコードを書いて判断したことを思い出しました...
以下は記事の完全な紹介です。
デフォルトの検証ルール
(1)required:true 必須フィールド
(3) email: true 正しい形式で電子メールを入力する必要があります
(4)url:true 正しい形式で URL を入力する必要があります
(5)date:true 正しい形式で日付を入力する必要があります
(6)dateISO:true 正しい形式を入力する必要があります 形式 (ISO) の日付、例: 2009-06-23、1998/01/22 有効性ではなく形式のみを検証します
(7)number: true 有効な番号 (負の数、10 進数) を入力する必要があります
(8)digits:true は整数を入力する必要があります
(9)creditcard: 有効なクレジット カード番号を入力する必要があります
(10)equalTo:" #field" 入力値は #field
(11)accept: 有効なサフィックス (アップロードされたファイルのサフィックス) を含む文字列を入力してください
(12)maxlength:5 を含む文字列を入力してください最大長は 5 (中国語は 1 文字としてカウントされます)
(13)minlength:10 最小入力長は 10 の文字列です (中国語は 1 文字としてカウントされます)
(14)rangelength:[5,10 ] 入力長は 5 ～ 10 の文字列である必要があります") (漢字は 1 文字としてカウントされます)
(15) range:[5,10] 入力値は 5 ～ 10 の範囲である必要があります
(16) max:5 入力値は 5 より大きくすることはできません
(17)min:10 入力値は 10 未満にすることはできません
デフォルトのヒント
コードをコピー
コードは次のとおりです: messages: { required: "このフィールドは必須です。", remote: "このフィールドを修正してください."、email: "有効な電子メール アドレスを入力してください。"、
url: "有効な URL を入力してください。"、 date: "有効な日付を入力してください。"、
dateISO : "有効な日付 (ISO) を入力してください。"、
dateDE: "数値を入力してください。"、
number : "有効な数値を入力してください。"、
numberDE: "ビットgeben Sie eine Nummer ein."、
digits: "数字のみを入力してください。"、
creditcard: "有効なクレジット カード番号を入力してください。"、
equalTo: "同じ値を再度入力してください。" 、
accept: "有効な拡張子を含む値を入力してください。"、
maxlength: $.validator.format("{0} 文字以内を入力してください。")、
minlength: $。 validator.format("少なくとも {0} 文字を入力してください。"),
rangelength: $.validator.format("長さは {0} ～ {1} 文字の間の値を入力してください。"),
range: $.validator.format("{0} から {1} までの値を入力してください。")、
max: $.validator .format("{0} 以下の値を入力してください。 "),
min: $.validator.format("{0} 以上の値を入力してください。")
},
変更する必要がある場合は、js コードに追加できます。
jQuery.extend(jQuery.validator.messages, {
required: "必須フィールド",
remote: "このフィールドを修正してください",
email: "正しい形式の電子メールを入力してください。" 、
url: "法的な URL を入力してください。"、
date: "法的な日付を入力してください。"、
dateISO: "法的な日付 (ISO) を入力してください。 "、
number: "有効な番号を入力してください"、
digits: "整数のみを入力できます"、
creditcard: "有効なクレジット カード番号を入力してください"、
equalTo: "同じ値を再度入力してください",
accept: "有効なサフィックスを含む文字列を入力してください",
maxlength: jQuery.validator.format("長さが最大 {0} の文字列を入力してください"),
minlength: jQuery.validator.format("長さが {0} 以上の文字列を入力してください"),
rangelength: jQuery.validator.format("長さが {0} の間の文字列を入力してくださいおよび {1}") 、
range: jQuery.validator.format("{0} から {1} までの値を入力してください")、
max: jQuery.validator.format("値を入力してください最大値は { 0} です"),
min: jQuery.validator.format("最小値 {0} を入力してください")
});
推奨練習として、このファイルをmessages_cn.jsに配置し、
の使用法を導入します。ページ
1. 検証ルールをコントロールに書き込みます
dateISO : "有効な日付 (ISO) を入力してください。"、
dateDE: "数値を入力してください。"、
number : "有効な数値を入力してください。"、
numberDE: "ビットgeben Sie eine Nummer ein."、
digits: "数字のみを入力してください。"、
creditcard: "有効なクレジット カード番号を入力してください。"、
equalTo: "同じ値を再度入力してください。" 、
accept: "有効な拡張子を含む値を入力してください。"、
maxlength: $.validator.format("{0} 文字以内を入力してください。")、
minlength: $。 validator.format("少なくとも {0} 文字を入力してください。"),
rangelength: $.validator.format("長さは {0} ～ {1} 文字の間の値を入力してください。"),
range: $.validator.format("{0} から {1} までの値を入力してください。")、
max: $.validator .format("{0} 以下の値を入力してください。 "),
min: $.validator.format("{0} 以上の値を入力してください。")
},
変更する必要がある場合は、js コードに追加できます。
コードをコピーします コードは次のとおりです。
jQuery.extend(jQuery.validator.messages, {
required: "必須フィールド",
remote: "このフィールドを修正してください",
email: "正しい形式の電子メールを入力してください。" 、
url: "法的な URL を入力してください。"、
date: "法的な日付を入力してください。"、
dateISO: "法的な日付 (ISO) を入力してください。 "、
number: "有効な番号を入力してください"、
digits: "整数のみを入力できます"、
creditcard: "有効なクレジット カード番号を入力してください"、
equalTo: "同じ値を再度入力してください",
accept: "有効なサフィックスを含む文字列を入力してください",
maxlength: jQuery.validator.format("長さが最大 {0} の文字列を入力してください"),
minlength: jQuery.validator.format("長さが {0} 以上の文字列を入力してください"),
rangelength: jQuery.validator.format("長さが {0} の間の文字列を入力してくださいおよび {1}") 、
range: jQuery.validator.format("{0} から {1} までの値を入力してください")、
max: jQuery.validator.format("値を入力してください最大値は { 0} です"),
min: jQuery.validator.format("最小値 {0} を入力してください")
});
推奨練習として、このファイルをmessages_cn.jsに配置し、
の使用法を導入します。ページ
1. 検証ルールをコントロールに書き込みます
コードをコピーします コードは次のとおりです: