`
hehch
  • 浏览: 39888 次
  • 性别: Icon_minigender_1
社区版块
存档分类
最新评论

jquery验证规则添加

    博客分类:
  • js
阅读更多
  1/**//** 
  2 *
  3 */ 
  4$(document).ready(function(){      
  5        
  6/**//* 设置默认属性 */      
  7$.validator.setDefaults({      
  8    submitHandler: function(form) {   
  9        form.submit();   
10    }      
11});  
12 
13// 字符验证      
14jQuery.validator.addMethod("stringCheck", function(value, element) {      
15    return this.optional(element) || /^[\u0391-\uFFE5\w]+$/.test(value);      
16}, "只能包括中文字、英文字母、数字和下划线");  
17 
18// 中文字两个字节      
19jQuery.validator.addMethod("byteRangeLength", function(value, element, param) {      
20    var length = value.length;      
21    for(var i = 0; i < value.length; i++){      
22        if(value.charCodeAt(i) > 127){      
23        length++;      
24        }      
25    }      
26    return this.optional(element) || ( length >= param[0] && length <= param[1] );      
27}, "请确保输入的值在3-15个字节之间(一个中文字算2个字节)");  
28 
29// 身份证号码验证      
30jQuery.validator.addMethod("isIdCardNo", function(value, element) {      
31    return this.optional(element) || isIdCardNo(value);      
32}, "请正确输入您的身份证号码");   
33    
34// 手机号码验证      
35jQuery.validator.addMethod("isMobile", function(value, element) {      
36    var length = value.length;  
37    var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;  
38    return this.optional(element) || (length == 11 && mobile.test(value));      
39}, "请正确填写您的手机号码");      
40    
41// 电话号码验证      
42jQuery.validator.addMethod("isTel", function(value, element) {      
43    var tel = /^\d{3,4}-?\d{7,9}$/;    //电话号码格式010-12345678  
44    return this.optional(element) || (tel.test(value));      
45}, "请正确填写您的电话号码");  
46 
47// 联系电话(手机/电话皆可)验证  
48jQuery.validator.addMethod("isPhone", function(value,element) {  
49    var length = value.length;  
50    var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;  
51    var tel = /^\d{3,4}-?\d{7,9}$/;  
52    return this.optional(element) || (tel.test(value) || mobile.test(value));  
53 
54}, "请正确填写您的联系电话");  
55    
56// 邮政编码验证      
57jQuery.validator.addMethod("isZipCode", function(value, element) {      
58    var tel = /^[0-9]{6}$/;      
59    return this.optional(element) || (tel.test(value));      
60}, "请正确填写您的邮政编码");   
61 
62//开始验证  
63$('#submitForm').validate({  
64    /**//* 设置验证规则 */ 
65    rules: {  
66        username: {  
67            required:true,  
68            stringCheck:true,  
69            byteRangeLength:[3,15]  
70        },  
71        email:{  
72            required:true,  
73            email:true 
74        },  
75        phone:{  
76            required:true,  
77            isPhone:true 
78        },  
79        address:{  
80            required:true,  
81            stringCheck:true,  
82            byteRangeLength:[3,100]  
83        }  
84    },  
85      
86    /**//* 设置错误信息 */ 
87    messages: {  
88        username: {      
89            required: "请填写用户名",  
90            stringCheck: "用户名只能包括中文字、英文字母、数字和下划线",  
91            byteRangeLength: "用户名必须在3-15个字符之间(一个中文字算2个字符)"      
92        },  
93        email:{  
94            required: "请输入一个Email地址",  
95            email: "请输入一个有效的Email地址" 
96        },  
97        phone:{  
98            required: "请输入您的联系电话",  
99            isPhone: "请输入一个有效的联系电话" 
100        },  
101        address:{  
102            required: "请输入您的联系地址",  
103            stringCheck: "请正确输入您的联系地址",  
104            byteRangeLength: "请详实您的联系地址以便于我们联系您" 
105        }  
106    },  
107      
108    /**//* 设置验证触发事件 */ 
109    focusInvalid: false,  
110    onkeyup: false,  
111      
112    /**//* 设置错误信息提示DOM */ 
113    errorPlacement: function(error, element) {      
114        error.appendTo( element.parent());      
115    },    
116      
117});  
118 
119});
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics