沫沫金原创提供：完整的根据身份证获取省份、性别、年龄、生日及页面验证

概述：

身份证的校验，识别，分离，处处可见。最近H5移动端的项目就需要扫码获取身份证，根据身份证自动识别省份、性别、年龄、生日信息。这里分享完善版，希望大家喜欢。

环境：

依赖jQuery、BootStrap

Html

<form id="cardForm">
				  <div class="form-group">
				    <label>姓名</label>
				    <input id="patientname" name="patientname" type="text" class="form-control" placeholder="姓名">
				  </div>
				  <div class="form-group">
				    <label for="exampleInputFile">身份证号</label>
				    <input id="idcard" name="idcardno" type="text" class="form-control" placeholder="身份证号" onblur="handIdcard(this.value)" onfocus="clearIdcard()">
				  </div>
				  <div class="form-group">
				    <label for="exampleInputFile">联系电话</label>
				    <input name="mobile" type="number" class="form-control" placeholder="联系电话">
				  </div>
				  <div class="form-group">
				    <label for="exampleInputPassword1">省份</label>
				    <input id="province"  name="address" type="text" class="form-control" placeholder="输入身份证自动识别省份" readonly="true">
				  </div>
				  <div class="form-group">
				    <label for="exampleInputPassword1">生日</label>
				    <input id="birthday"  name="birthday" type="text" class="form-control" placeholder="输入身份证自动识别生日" readonly="true">
				  </div>
				  <div class="form-group">
				    <label for="exampleInputPassword1">性别</label>
				    <input id="sex"  name="sex" type="hidden">
				    <input id="sexName" type="text" class="form-control" placeholder="输入身份证自动识别性别" disabled="true">
				  </div>
				  <div class="form-group">
				    <label for="exampleInputPassword1">年龄</label>
				    <input id="age"  name="patientage" type="text" class="form-control" placeholder="输入身份证自动识别年龄" readonly="true">
				  </div>
				  <button type="button" class="btn btn-success" style="width: 100%" onclick="submitCard()">保存</button>
				</form>

 JavaScript：身份证验证及自动识别部分

  1 /**
  2          * 手动 - 输入身份证校验并解析
  3          * 描述：验证合法的身份证并回填省份、生日、性别
  4          *  */
  5         function handIdcard(obj){
  6             var idcardVlidate = cardCheck(obj);
  7             if(idcardVlidate){
  8                 callIdcard(idcardVlidate);
  9             }else{
 10                 $("#idcard").focus();
 11             }
 12         }
 13         /**
 14          * 私有 - 工具 - 回填解析后的身份证信息
 15          * 描述：省份、生日、性别
 16          *  */
 17         function callIdcard(fmtVal){
 18             $("#province").val(fmtVal.addr);
 19             $("#birthday").val(fmtVal.birth);
 20             $("#sex").val(fmtVal.sex);
 21             $("#sexName").val(getSexName(fmtVal.sex));
 22             $("#age").val(fmtVal.age);
 23         }
 24         /**
 25          * 私有 - 工具 - 清理以下页面信息
 26          * 描述：身份证号码、省份、生日、性别
 27          *  */
 28         function clearIdcard(){
 29             if($("#province").val()!='')$("#idcard").val('');
 30             $("#province").val('');
 31             $("#birthday").val('');
 32             $("#sex").val('');
 33             $("#sexName").val('');
 34             $("#age").val('');
 35         }
 36         
 37                     
 38         /**身份证验证并获取生日及性别 Begin*/
 39         //全局变量
 40         var birth;
 41         var sex;
 42         var addrs;
 43         
 44         var year;
 45         var age;
 46         var address;
 47         var city = { 11: "北京", 12: "天津", 13: "河北", 14: "山西", 15: "内蒙古", 21: "辽宁", 22: "吉林", 23: "黑龙江 ", 31: "上海", 
 48                          32: "江苏", 33: "浙江", 34: "安徽", 35: "福建", 36: "江西", 37: "山东", 41: "河南", 42: "湖北 ", 43: "湖南", 
 49                          44: "广东", 45: "广西", 46: "海南", 50: "重庆", 51: "四川", 52: "贵州", 53: "云南", 54: "西藏 ", 61: "陕西", 
 50                          62: "甘肃", 63: "青海", 64: "宁夏", 65: "新疆", 71: "台湾", 81: "香港", 82: "澳门", 91: "国外 " };
 51         
 52         //身份证验证
 53         function cardCheck(card) {
 54             var d = new Date();
 55             var reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
 56             address = city[card.substr(0, 2)];
 57             
 58             if (card === "")
 59             {
 60                 alert("身份证必须填写，请检查。");
 61                 return false;
 62             }
 63             else if (reg.test(card) === false)
 64             {
 65                 alert("身份证号码应为数字，长度应为15位或18位，请检查。");
 66                 return false;
 67             }
 68             else if (!city[card.substr(0, 2)]) {
 69                 alert("身份证号前两位无效，请检查。");
 70                 return false;
 71             }
 72             //处理18位的身份证号码
 73             else if (card.length == 18)
 74             {
 75                 birth = card.substr(6, 4) + "-" + card.substr(10, 2) + "-" + card.substr(12, 2);
 76                 sex = sexCheck(card.substr(14, 3));
 77                 if (!(dateCheck(parseInt(card.substr(6, 4)), parseInt(card.substr(10, 2)), parseInt(card.substr(12, 2))))) {
 78                     return false;
 79                 }
 80                 year = parseInt(card.substr(6, 4));
 81                 //18位身份证需要验证最后一位校验位
 82                 if (card.length == 18)
 83                 {
 84                     card = card.split('');
 85                     //∑(ai×Wi)(mod 11)
 86                     //加权因子
 87                     var factor = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
 88                     //校验位
 89                     var parity = [1, 0, 'X', 9, 8, 7, 6, 5, 4, 3, 2];
 90                     var sum = 0;
 91                     var ai = 0;
 92                     var wi = 0;
 93                     for (var i = 0; i < 17; i++)
 94                     {
 95                         ai = card[i];
 96                         wi = factor[i];
 97                         sum += ai * wi;
 98                     }
 99                     var last = parity[sum % 11];
100                     if (parity[sum % 11] != card[17])
101                     {
102                         alert("身份证号最后一位[x]需要大写[X]，请检查。");
103                         return false;
104                     }
105                 }
106                 else
107                 {
108                     //年龄
109                     age = (parseInt(d.getFullYear()) - year);
110                     return {"addr":address,"birth":birth,"sex":sex ,"age":age};;
111                 }
112             }//处理15位的身份号码
113             else if (card.length == 15)
114             {
115                 birth = "19" + card.substr(6, 2) + "-" + card.substr(8, 2) + "-" + card.substr(10, 2);
116                 sex = sexCheck(card.substr(12, 3));
117                 if (!(dateCheck(parseInt(card.substr(6, 2)), parseInt(card.substr(8, 2)), parseInt(card.substr(10, 2)))))
118                 {
119                     return false;
120                 }
121                 year = parseInt(card.substr(6, 2));
122             }
123         
124             //年龄
125             age = (parseInt(d.getFullYear()) - year);
126             return {"addr":address,"birth":birth,"sex":sex ,"age":age};
127         }
128         
129         //年月日验证
130         function dateCheck(year, month, day)
131         {
132             var d = new Date();
133             if (month > 12 || month <= 0)
134             {
135                 alert("月应在1-12之间");
136                 return false;
137             }
138             if (day > 31 || day <= 0)
139             {
140                 alert("日应在1-31之间");
141                 return false;
142             }
143             var nowYear = d.getFullYear();
144             if (year > nowYear)
145             {
146                 alert("年不能超过今年");
147                 return false;
148             }
149             return true;
150         }
151         
152         //判断性别
153         function sexCheck(sex)
154         {
155             if (parseInt(sex) % 2 == 0) {
156                 return "2";
157             }
158             else
159             {
160                 return "1";
161             }
162         }
163         /**
164          * 给用户显示汉字性别 
165          */
166         function getSexName(sex){
167             if(sex==1){return "男"}
168             else if(sex==2){return "女"}
169             else {return "未知"}
170         }

JavaScript：表单提交校验部分

/**
		 * 提交 - 卡信息 
		 */
		function submitCard(){
			if(emptyValidata({
			"patientname":"姓名不能为空",
			"idcard":"身份证号不能为空",
			"province":"省份不能为空"
			})){
				alert("此处，请求后台。请编写自身项目的业务代码");
			}
			
		}
		/**
		 *验证 - 提交 - 非空 
		 */
		function emptyValidata(vldtJson){
			for(var key in vldtJson){
				if($("#"+key).val()==""){$("#"+key).focus(); alert(vldtJson[key]);return false;}
			}
			return true;
		}

 以上，ok.

--by.沫沫金

微信联系

 

posted @ 2017-08-03 17:01  章力  阅读(707)  评论(0)  编辑  收藏  举报