vue 身份证校验
VUE中如何进行身份证合法性校验(身份证18位,包含最后一位数字/字母)
·
最近在做项目过程中,测试组人员对添加表单中的身份信息提出了需求,在填写身份证信息时,希望能对所填信息进行合法性校验。比如身份证的位数(目前二代身份证都是18位)、地区编号(所在省(市,旗,区)的行政区代码)、出生年月日(月份所对应的28天/29天/30天/31天)、顺序码(第十五到十七位,第十七位奇数是男性,偶数是女性),校验码(第十八位,如果尾号是10就用X代替了)。
html 代码
<el-form ref="xfrxxForm" :model="xfrxxForm" :rules="xfrxxRules" label-width="100px">
<el-form-item label="证件号码" prop="zjhm">
<el-input v-model="xfrxxForm.zjhm" maxlength="18" show-word-limit placeholder="请输入身份证号码"/>
</el-form-item>
</el-form>
js 部分
data() {
return {
xfrxxRules:{
zjhm: [
{required: true, message: '请输入身份证', trigger: 'blur'},
{
pattern: /(^\d{8}(0\d|10|11|12)([0-2]\d|30|31)\d{3}$)|(^\d{6}(18|19|20)\d{2}(0\d|10|11|12)([0-2]\d|30|31)\d{3}(\d|X|x)$)/,
message: '请输入正确的证件号', trigger: 'blur',
validator: this.validSjh
}
],
}
}
},
methods:{
// 身份证验证
async validSjh(rule, value, callback) {
// 身份证号码为15位或者18位,15位时全为数字,18位前17位为数字,最后一位是校验位,可能为数字或字符X
let reg = /(^\d{8}(0\d|10|11|12)([0-2]\d|30|31)\d{3}$)|(^\d{6}(18|19|20)\d{2}(0\d|10|11|12)([0-2]\d|30|31)\d{3}(\d|X|x)$)/;
if (!value) {
return callback(new Error("身份证号不能为空"));
} else if (!reg.test(value)) {
callback(new Error("你输入的身份证长度或格式错误"));
} else {
//身份证城市
var aCity = {
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: "国外"
};
if (!aCity[parseInt(value.substr(0, 2))]) {
callback(new Error("你的身份证地区非法"));
}
// 出生日期验证
var sBirthday = (
value.substr(6, 4) + "-" +
Number(value.substr(10, 2)) + "-" +
Number(value.substr(12, 2))
).replace(/-/g, "/"),
d = new Date(sBirthday);
if (sBirthday != d.getFullYear() + "/" + (d.getMonth() + 1) + "/" + d.getDate()) {
callback(new Error("身份证上的出生日期非法"));
}
// 身份证号码校验
var sum = 0,
weights = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2],
codes = "10X98765432";
for (var i = 0; i < value.length - 1; i++) {
sum += value[i] * weights[i];
}
var last = codes[sum % 11]; //计算出来的最后一位身份证号码
if (value[value.length - 1] != last) {
callback(new Error("你输入的身份证号非法"));
} else {
await this.go(value, value.length);
}
callback();
}
},
}
封装使用 validate.js
export function isIdentityId(identityId) {
var patrn = /(^\d{15}$)|(^\d{17}(\d|X|x)$)/;//长度或格式校验
//地区校验
var aCity = {
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: "国外"
};
// 出生日期验证
var sBirthday = (
identityId.substr(6, 4) +
"-" +
Number(identityId.substr(10, 2)) +
"-" +
Number(identityId.substr(12, 2))
).replace(/-/g, "/"),
d = new Date(sBirthday)
// 身份证号码校验 最后4位 包括最后一位的数字/字母X
var sum = 0,
weights = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2],
codes = "10X98765432";
for (var i = 0; i < identityId.length - 1; i++) {
sum += identityId[i] * weights[i];
}
var last = codes[sum % 11]; //计算出来的最后一位身份证号码
var errorMsg = '';
if (identityId === '') {
errorMsg = "身份证号不能为空"
} else if (!patrn.exec(identityId)) {
errorMsg = "你输入的身份证长度或格式错误"
} else if (!aCity[parseInt(identityId.substr(0, 2))]) {
errorMsg = "你的身份证地区非法"
} else if (sBirthday != d.getFullYear() + "/" + (d.getMonth() + 1) + "/" + d.getDate()) { errorMsg = "身份证上的出生日期非法" } else if (identityId[identityId.length - 1] != last) {
errorMsg = "你输入的身份证号非法"
}
return errorMsg;
}
页面中使用
import { isIdentityId } from "../people-manage/validate";
data() {
var checkIdentitytionId = (rule, value, callback) => {
var errorMsg = isIdentityId(value);
if (errorMsg != "") {
callback(new Error(errorMsg));
}
};
//校验规则
rules: {
identitytionId: [
// { required: true, message: "请输入身份证号!", trigger: "blur" },
{ validator: checkIdentitytionId , trigger: "blur" }
]
}
更多推荐
已为社区贡献7条内容
所有评论(0)