jquery validation验证身份证号、护照、电话号码、email
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" > <html xmlns= "http://www.w3.org/1999/xhtml" > <head> <meta http-equiv= "Content-Type" content= "text/html; charset=gb2312" /> <!-- TemplateBeginEditable name= "doctitle" --> <title>无标题文档</title> <script src= "lib/jquery.js" type= "text/javascript" ></script> <script src= "lib/jquery.validate.js" type= "text/javascript" ></script> <script src= "lib/card.js" type= "text/javascript" ></script> <script src= "lib/validata.js" type= "text/javascript" ></script> <style type= "text/css" > em.success{ background:url( "images/tips_arrow.gif" ) no-repeat left 0px; padding-left:16px; margin-left:2px; } em.error{ background:url( "images/tips_arrow.gif" ) no-repeat left -51px; display:inline; padding-left:10px; font-style:normal; font-size:11px; margin-left:2px; font-family:12px/162% Arial, Helvetica, sans-serif; } </style> </head> <body> <form class = "cmsform" id= "commentForm" method= "get" action= "" > <p> <label for = "cusername" >姓名</label><em>*</em> <input id= "cusername" name= "username" size= "25" /> </p> <p> <label for = "cemail" >电子邮件</label><em>*</em> <input id= "cemail" name= "email" size= "25" /> </p> <p> <label for = "card" >身份证号</label><em>*</em> <input id= "card" name= "card" size= "25" /> </p> <p> <label for = "passport" >护照编号</label><em>*</em> <input id= "passport" name= "passport" size= "25" /> </p> <p> <label for = "phone" >电话号码</label><em>*</em> <input id= "phone" name= "phone" size= "25" /> </p> </form> </body> </html> |
validata.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
|
$( function (){ $.validator.setDefaults({ submitHandler: function (form) { form.submit(); } }); // 字符验证 jQuery.validator.addMethod( "stringCheck" , function (value, element) { return this .optional(element) || /^[\u0391-\uFFE5\w]+$/.test(value); }, "只能包括中文字、英文字母、数字和下划线" ); // 中文字两个字节 jQuery.validator.addMethod( "byteRangeLength" , function (value, element, param) { var length = value.length; for ( var i = 0; i < value.length; i++){ if (value.charCodeAt(i) > 127){ length++; } } return this .optional(element) || ( length >= param[0] && length <= param[1] ); }, "请确保输入的值在3-15个字节之间(一个中文字算2个字节)" ); // 身份证号码验证 jQuery.validator.addMethod( "isIdCardNo" , function (value, element) { return this .optional(element) || idCardNoUtil.checkIdCardNo(value); }, "请正确输入您的身份证号码" ); //护照编号验证 jQuery.validator.addMethod( "passport" , function (value, element) { return this .optional(element) || checknumber(value); }, "请正确输入您的护照编号" ); // 手机号码验证 jQuery.validator.addMethod( "isMobile" , function (value, element) { var length = value.length; var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/; return this .optional(element) || (length == 11 && mobile.test(value)); }, "请正确填写您的手机号码" ); // 电话号码验证 jQuery.validator.addMethod( "isTel" , function (value, element) { var tel = /^\d{3,4}-?\d{7,9}$/; //电话号码格式010-12345678 return this .optional(element) || (tel.test(value)); }, "请正确填写您的电话号码" ); // 联系电话(手机/电话皆可)验证 jQuery.validator.addMethod( "isPhone" , function (value,element) { var length = value.length; var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/; var tel = /^\d{3,4}-?\d{7,9}$/; return this .optional(element) || (tel.test(value) || mobile.test(value)); }, "请正确填写您的联系电话" ); // 邮政编码验证 jQuery.validator.addMethod( "isZipCode" , function (value, element) { var tel = /^[0-9]{6}$/; return this .optional(element) || (tel.test(value)); }, "请正确填写您的邮政编码" ); //开始验证 $( '#commentForm' ).validate({ rules: { username: { required: true , stringCheck: true , byteRangeLength:[3,15] }, email:{ required: true , email: true }, phone:{ required: true , isMobile: true }, address:{ required: true , stringCheck: true , byteRangeLength:[3,100] }, card:{ required: true , isIdCardNo: true }, passport:{ required: true , passport: true } }, messages:{ username: { required: "请填写用户名" , stringCheck: "用户名只能包括中文字、英文字母、数字和下划线" , byteRangeLength: "用户名必须在3-15个字符之间(一个中文字算2个字符)" }, email:{ required: "<font color=red>请输入一个Email地址</fond>" , email: "请输入一个有效的Email地址" }, phone:{ required: "请输入您的联系电话" , isPhone: "请输入一个有效的联系电话" }, address:{ required: "请输入您的联系地址" , stringCheck: "请正确输入您的联系地址" , byteRangeLength: "请详实您的联系地址以便于我们联系您" }, card:{ required: "请输入身份证号" , isIdCardNo: "请输入正确的身份证号" }, passport:{ required: "请输入护照编号" , passport: "请输入正确的护照编号" } }, focusInvalid: false , onkeyup: false , errorPlacement: function (error, element) { error.appendTo( element.parent()); }, errorElement: "em" , error: function (label){label.text( " " ).addClass( "error" );} }); }) |
card.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
|
var idCardNoUtil = { provinceAndCitys: {11: "北京" ,12: "天津" ,13: "河北" ,14: "山西" ,15: "内蒙古" ,21: "辽宁" ,22: "吉林" ,23: "黑龙江" , 31: "上海" ,32: "江苏" ,33: "浙江" ,34: "安徽" ,35: "福建" ,36: "江西" ,37: "山东" ,41: "河南" ,42: "湖北" ,43: "湖南" ,44: "广东" , 45: "广西" ,46: "海南" ,50: "重庆" ,51: "四川" ,52: "贵州" ,53: "云南" ,54: "西藏" ,61: "陕西" ,62: "甘肃" ,63: "青海" ,64: "宁夏" , 65: "新疆" ,71: "台湾" ,81: "香港" ,82: "澳门" ,91: "国外" }, powers: [ "7" , "9" , "10" , "5" , "8" , "4" , "2" , "1" , "6" , "3" , "7" , "9" , "10" , "5" , "8" , "4" , "2" ], parityBit: [ "1" , "0" , "X" , "9" , "8" , "7" , "6" , "5" , "4" , "3" , "2" ], genders: {male: "男" ,female: "女" }, checkAddressCode: function (addressCode){ var check = /^[1-9]\d{5}$/.test(addressCode); if (!check) return false ; if (idCardNoUtil.provinceAndCitys[parseInt(addressCode.substring(0,2))]){ return true ; } else { return false ; } }, checkBirthDayCode: function (birDayCode){ var check = /^[1-9]\d{3}((0[1-9])|(1[0-2]))((0[1-9])|([1-2][0-9])|(3[0-1]))$/.test(birDayCode); if (!check) return false ; var yyyy = parseInt(birDayCode.substring(0,4),10); var mm = parseInt(birDayCode.substring(4,6),10); var dd = parseInt(birDayCode.substring(6),10); var xdata = new Date(yyyy,mm-1,dd); if (xdata > new Date()){ return false ; //生日不能大于当前日期 } else if ( ( xdata.getFullYear() == yyyy ) && ( xdata.getMonth () == mm - 1 ) && ( xdata.getDate() == dd ) ){ return true ; } else { return false ; } }, getParityBit: function (idCardNo){ var id17 = idCardNo.substring(0,17); var power = 0; for ( var i=0;i<17;i++){ power += parseInt(id17.charAt(i),10) * parseInt(idCardNoUtil.powers[i]); } var mod = power % 11; return idCardNoUtil.parityBit[mod]; }, checkParityBit: function (idCardNo){ var parityBit = idCardNo.charAt(17).toUpperCase(); if (idCardNoUtil.getParityBit(idCardNo) == parityBit){ return true ; } else { return false ; } }, checkIdCardNo: function (idCardNo){ //15位和18位身份证号码的基本校验 var check = /^\d{15}|(\d{17}(\d|x|X))$/.test(idCardNo); if (!check) return false ; //判断长度为15位或18位 if (idCardNo.length==15){ return idCardNoUtil.check15IdCardNo(idCardNo); } else if (idCardNo.length==18){ return idCardNoUtil.check18IdCardNo(idCardNo); } else { return false ; } }, //校验15位的身份证号码 check15IdCardNo: function (idCardNo){ //15位身份证号码的基本校验 var check = /^[1-9]\d{7}((0[1-9])|(1[0-2]))((0[1-9])|([1-2][0-9])|(3[0-1]))\d{3}$/.test(idCardNo); if (!check) return false ; //校验地址码 var addressCode = idCardNo.substring(0,6); check = idCardNoUtil.checkAddressCode(addressCode); if (!check) return false ; var birDayCode = '19' + idCardNo.substring(6,12); //校验日期码 return idCardNoUtil.checkBirthDayCode(birDayCode); }, //校验18位的身份证号码 check18IdCardNo: function (idCardNo){ //18位身份证号码的基本格式校验 var check = /^[1-9]\d{5}[1-9]\d{3}((0[1-9])|(1[0-2]))((0[1-9])|([1-2][0-9])|(3[0-1]))\d{3}(\d|x|X)$/.test(idCardNo); if (!check) return false ; //校验地址码 var addressCode = idCardNo.substring(0,6); check = idCardNoUtil.checkAddressCode(addressCode); if (!check) return false ; //校验日期码 var birDayCode = idCardNo.substring(6,14); check = idCardNoUtil.checkBirthDayCode(birDayCode); if (!check) return false ; //验证校检码 return idCardNoUtil.checkParityBit(idCardNo); }, formateDateCN: function (day){ var yyyy =day.substring(0,4); var mm = day.substring(4,6); var dd = day.substring(6); return yyyy + '-' + mm + '-' + dd; }, //获取信息 getIdCardInfo: function (idCardNo){ var idCardInfo = { gender: "" , //性别 birthday: "" // 出生日期(yyyy-mm-dd) }; if (idCardNo.length==15){ var aday = '19' + idCardNo.substring(6,12); idCardInfo.birthday=idCardNoUtil.formateDateCN(aday); if (parseInt(idCardNo.charAt(14))%2==0){ idCardInfo.gender=idCardNoUtil.genders.female; } else { idCardInfo.gender=idCardNoUtil.genders.male; } } else if (idCardNo.length==18){ var aday = idCardNo.substring(6,14); idCardInfo.birthday = idCardNoUtil.formateDateCN(aday); if (parseInt(idCardNo.charAt(16))%2==0){ idCardInfo.gender = idCardNoUtil.genders.female; } else { idCardInfo.gender = idCardNoUtil.genders.male; } } return idCardInfo; }, getId15: function (idCardNo){ if (idCardNo.length==15){ return idCardNo; } else if (idCardNo.length==18){ return idCardNo.substring(0,6) + idCardNo.substring(8,17); } else { return null ; } }, getId18: function (idCardNo){ if (idCardNo.length==15){ var id17 = idCardNo.substring(0,6) + '19' + idCardNo.substring(6);
validata.js
card.js
return id17 + parityBit; } else if (idCardNo.length==18){ return idCardNo; } else { return null ; } } }; //验证护照是否正确 function checknumber(number){ var str=number; //在JavaScript中,正则表达式只能使用"/"开头和结束,不能使用双引号 var Expression=/(P\d{7})|(G\d{8})/; var objExp= new RegExp(Expression); if (objExp.test(str)== true ){ return true ; } else { return false ; } };
|
jquery validation验证身份证号、护照、电话号码、email的更多相关文章
- bootstrap-validator基本使用(自定义验证身份证号和手机号)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...
- JavaScript验证身份证号
<%@ page language="java" contentType="text/html; charset=GB18030" pageEncodin ...
- javascript实现验证身份证号的有效性并提示
javascript实现验证身份证号的有效性并提示 function nunber(allowancePersonValue){ if(allowancePersonValue=="身份证号 ...
- js验证身份证号,超准确
js验证身份证号,超准确 看程序前先来了解下身份证号的构成:身份证号分为两种,旧的为15位,新的为18位.身份证15位编码规则:dddddd yymmdd xx p 其中 dddddd:地区码 ...
- js正则表达式验证身份证号和密码
//验证身份证号只能输入15位或者18位的身份证号 /^\d{14}[X|\d]{1}$|^\d{18}$/ig //验证只能输入字母和数字组合6到16位 /^[a-z][a-z0-9]{6,16}$ ...
- Android 使用正则表达式验证身份证号是否符合规则
我国当前的身份证号分为三种: 一.15位身份证号 二.18位身份证号(前17位位数字,最后一位为字母x) 三.18为身份证号(18位都是数字) 具体验证请参考下面代码: /** * 验证身份证号是否符 ...
- js进阶正则表达式15验证身份证号(|符号的使用:var reg=/^\d{17}[\d|X]$|^\d{15}$/)(str的方法substr)
js进阶正则表达式15验证身份证号(|符号的使用:var reg=/^\d{17}[\d|X]$|^\d{15}$/)(str的方法substr) 一.总结 1.|符号的使用:var reg=/^\d ...
- Jquery Validation 验证控件的使用说明
转载自:http://blog.csdn.net/huang100qi/article/details/52453970,做了一些简化及修改 下载地址:https://jqueryvalidation ...
- 锋利的js之验证身份证号
我们在做互联网网站时,注册个人资料时,经常要用到身份证号,我们需要对身份证进验证,不然别人随便输个号码就通过,让你感觉这个网站做得很shit. 身份证号是有规则的. 结构和形式 1.号码的结构 公民 ...
随机推荐
- tr循环,每行 2个数相加 求出和位第三个数赋值 (http://jsfiddle.net/hgeL44rz/113/)
<table id="tb"> <tr> <th>单价</th> <th>数量</th> <th> ...
- table <thead>表格css‘样式
<table class="table table-bordered table-hover" id=""> <thead> <t ...
- COM线程模型的行为
原文:https://msdn.microsoft.com/library/ms809971.aspx Behavior of the COM Threading Models COM线程模型的行为 ...
- WCF DEMO2 基于HTTP-GET的元数据交换及Configure()方法以及添加MEX终结点
using System; using System.Diagnostics; using System.Linq; using System.ServiceModel; using System.S ...
- Java中使用json时java.lang.NoClassDefFoundError: net/sf/ezmorph/Morpher问题解决
下面代码: public static void main(String[] args) { JSONObject obj = new JSONObject(); obj.put("msg& ...
- 资源在Windows编程中的应用
学习目的 掌握菜单和对话框资源的创建和使用. 编写程序: 设计一个窗口应用程序, 其中有一个VC菜单, 该菜单下有"显示", "隐藏", "退出&qu ...
- Yii中文乱码 解决
需要将config/main.php改成utf-8编码即可
- mysql + excel 校正线上数据
积分问题处理 1. 所有应补汇总 select driver_id, SUM(integral) from detail_score group by driver_id; 2. 原汇总积分 sele ...
- spring-boot-starter-actuator不起作用
spring-boot-starter-actuator的作用,actuator是监控系统健康情况的工具.使用这个功能首先要先添加依赖,如下.<!-- 监控和管理生产环境--><de ...
- 安装php扩展redis (windows环境)
首先十分感谢网络上支持开源分享的前辈们,资源真的太丰富了,虽然也有许多优秀的国外资源被墙了... 想要给php增加redis扩展第一步当然要知道自己使用的php版本以及一些配置.查看 phpinfo ...