码迷,mamicode.com
首页 > Web开发 > 详细

jQuery Plugins Validate

时间:2015-07-07 12:52:07      阅读:138      评论:0      收藏:0      [点我收藏+]

标签:

validate报错

 1 //onfocusout默认为true,但是加上会报错。
 2 //官方文档解释:
 3 //A boolean true is not a valid value.
 4 $("#test").validate({
 5     debug:true,
 6     onfocusout:true,
 7     rules: {
 8         testName: "required",
 9     },
10     messages: {
11         testName: { required: "请输入姓名" }
12     }
13 });

 

校验规则写在js代码

表单元素的获取使用name属性,区分大小写

 1 $().ready(function () {
 2     $("#formRegister").validate({
 3         debug: true,
 4         rules: {
 5             Email: {
 6                 required: true,
 7                 email: true,
 8             },
 9             Password: {
10                 required: true,
11                 rangelength: [6, 20],
12             },
13             repeat: {
14                 equalTo: ‘#password‘,
15             }
16         },
17         messages: {
18             Email: {
19                 required: ‘Email必须填写‘,
20                 email: ‘请输入正确的Email地址‘,
21             },
22             Password: {
23                 required: ‘密码必须填写‘,
24                 rangelength: ‘密码长度6-20位‘,
25             },
26             repeat: {
27                 equalTo: ‘两次输入的密码必须相同‘
28             }
29         }
30     });
31 });

 

校验代码写在html控件

 1 <form id="myform" method="post" action="">
 2     <p>
 3         <label for="myname">用户名:</label>
 4         <!-- id和name最好同时写上 -->
 5         <input id="myname" name="myname" class="required" />
 6     </p>
 7     <p>
 8         <label for="email">E-Mail:</label>
 9         <input id="email" name="email" class="required email" />
10     </p>
11     <p>
12         <label for="password">登陆密码:</label>
13         <input id="password" name="password" type="password"
14                class="{required:true,minlength:5}" />
15     </p>
16     <p>
17         <label for="confirm_password">确认密码:</label>
18         <input id="confirm_password" name="confirm_password" type="password"
19                class="{required:true,minlength:5,equalTo:‘#password‘}" />
20     </p>
21     <p>
22         <label for="confirm_password">性别:</label>
23         <!-- 表示必须选中一个 -->
24         <input type="radio" id="gender_male" value="m" name="gender" class="{required:true}" />
25         <input type="radio" id="gender_female" value="f" name="gender" />
26     </p>
27     <p>
28         <label for="confirm_password">爱好:</label>
29         <!-- checkbox的minlength表示必须选中的最小个数,maxlength表示最大的选中个数,rangelength:[2,3]表示选中个数区间  -->
30         <input type="checkbox" id="spam_email" value="email" name="spam[]" class="{required:true, minlength:2}" />
31         <input type="checkbox" id="spam_phone" value="phone" name="spam[]" />
32         <input type="checkbox" id="spam_mail" value="mail" name="spam[]" />
33     </p>
34     <p>
35         <label for="confirm_password">城市:</label>
36         <select id="jungle" name="jungle" title="Please select something!" class="{required:true}">
37             <option value=""></option>
38             <option value="1">厦门</option>
39             <option value="2">泉州</option>
40             <option value="3">Oi</option>
41         </select>
42     </p>
43     <p>
44         <input class="submit" type="submit" value="立即注册" />
45     </p>
46 </form>

 

jQuery Plugins Validate

标签:

原文地址:http://www.cnblogs.com/pzpzpop/p/4626537.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!