Webページでjquery validateでフォーム入力項目を検証する

3655 ワード

本人菜鳥、w 3 cschoolのもの、いいと思います.
入庫
<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