Webページでjquery validateでフォーム入力項目を検証する
3655 ワード
本人菜鳥、w 3 cschoolのもの、いいと思います.
入庫
デフォルトのルールは、基本的に十分です.
1
required:true
入力する必要があるフィールド.
2
remote:"check.php"
ajaxメソッドを使用してcheckを呼び出す.php入力値を検証します.
3
email:true
正しい形式のEメールを入力する必要があります.
4
url:true
正しいフォーマットのURLを入力する必要があります.
5
date:true
正しいフォーマットの日付を入力する必要があります.日付検証ie 6でエラーが発生しました.慎重に使用してください.
6
dateISO:true
正しいフォーマットの日付(ISO)を入力する必要があります.たとえば、2009-06-231998/01/22です.フォーマットのみが検証され、有効性は検証されません.
7
number:true
合法的な数字(負数、小数)を入力する必要があります.
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より小さくしてはいけません.
ポイントは2つの使い方
1,classに書くにはこのjsを導入する必要がある
プリライト
私が使っているオブジェクトの方式なので、name属性はobjectです.prはこのように2つ目の方法で発見してはいけません.彼はname属性で検索しています.
2,jsに書く
以上がコピーです.詳細については、http://www.w3cschool.cc/jquery/jquery-plugin-validate.html
入庫
<script src="../js/jquery.js" type="text/javascript"></script>
<script src="../js/jquery.validate.js" type="text/javascript"></script>
デフォルトのルールは、基本的に十分です.
1
required:true
入力する必要があるフィールド.
2
remote:"check.php"
ajaxメソッドを使用してcheckを呼び出す.php入力値を検証します.
3
email:true
正しい形式のEメールを入力する必要があります.
4
url:true
正しいフォーマットのURLを入力する必要があります.
5
date:true
正しいフォーマットの日付を入力する必要があります.日付検証ie 6でエラーが発生しました.慎重に使用してください.
6
dateISO:true
正しいフォーマットの日付(ISO)を入力する必要があります.たとえば、2009-06-231998/01/22です.フォーマットのみが検証され、有効性は検証されません.
7
number:true
合法的な数字(負数、小数)を入力する必要があります.
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より小さくしてはいけません.
ポイントは2つの使い方
1,classに書くにはこのjsを導入する必要がある
<script src="../js/jquery.metadata.js" type="text/javascript"></script>
html
<input id="password" name="password" type="password" class="{required:true,minlength:5}" />
プリライト
$().ready(function() {
$("#signupForm").validate();
});
私が使っているオブジェクトの方式なので、name属性はobjectです.prはこのように2つ目の方法で発見してはいけません.彼はname属性で検索しています.
2,jsに書く
$().ready(function() {
$("#signupForm").validate({
rules: {
firstname: "required",
email: {
required: true,
email: true
},
password: {
required: true,
minlength: 5
},
confirm_password: {
required: true,
minlength: 5,
equalTo: "#password"
}
},
messages: {
firstname: " ",
email: {
required: " Email ",
email: " email "
},
password: {
required: " ",
minlength: jQuery.format(" {0} ")
},
confirm_password: {
required: " ",
minlength: " 5 ",
equalTo: " "
}
}
});
});
messages , message,
<form id="signupForm" method="get" action="">
<p>
<label for="firstname">Firstname</label>
<input id="firstname" name="firstname" />
</p>
<p>
<label for="email">E-Mail</label>
<input id="email" name="email" />
</p>
<p>
<label for="password">Password</label>
<input id="password" name="password" type="password" />
</p>
<p>
<label for="confirm_password"> </label>
<input id="confirm_password" name="confirm_password" type="password" />
</p>
<p>
<input class="submit" type="submit" value="Submit"/>
</p>
</form>
以上がコピーです.詳細については、http://www.w3cschool.cc/jquery/jquery-plugin-validate.html