身份证校验码是第18位字符,由前17位按iso 7064:1983.mod 11-2标准加权求和后对11取模得出,余数0–10对应校验码“10x98765432”,x代表10。
edit: "text" 本身不校验内容,只提供输入框,身份证格式限制必须靠额外控制。直接配 lay-verify="idcard" 在表格编辑单元格里无效——表格的 edit 模式不走表单模块的验证流程。
用 templet + input 事件实时截断非法字符
这是最稳的方式,兼容所有 Layui 版本(2.8+ 和旧版都行)。核心是放弃内置 edit,改用自定义模板手动接管输入逻辑。
- 在列定义中用
templet返回带maxlength="18"的<input>,并加data-field="idcard"标识 - 绑定
input事件:每次输入后用正则/^[0-9xX]{0,18}$/过滤,非匹配字符立即剔除 - 必须同时监听
paste事件:粘贴内容要先event.preventDefault(),再取clipboardData.getData('text')过滤后插入 - 避免重复绑定:表格重载时先
$('td[data-field="idcard"] input').off('input paste')再重新绑定
为什么不能只靠 form.verify + lay-verify
Layui 表格的 edit 模式生成的是裸 <input>,不经过 form.render(),所以 lay-verify 属性完全被忽略。即使你手动调用 form.verify,它也只在表单 submit 时触发,对单元格编辑无感知。
-
table.on('edit(filter)', callback)只在编辑完成(失焦/回车)后才触发,此时非法内容已写入数据源 - 想在输入过程中拦截,必须从 DOM 事件层下手,不是验证层
- 15 位老身份证号需额外兼容:正则得改成
/^([0-9]{15}|[0-9xX]{18})?$/,但注意长度限制仍要分情况处理(15 或 18)
提交前再做一次服务端可信任校验
前端拦截只是体验优化,用户仍可通过 DevTools 直接改 DOM 或发伪造请求绕过。后端必须用标准身份证校验算法(含校验码计算)确认合法性。
- 别只检查长度和正则,18 位末尾 X 是否合法、出生日期是否真实、顺序码是否为 000,都要验
- 前端提示语建议明确:“请输入 15 位或 18 位有效身份证号”,避免只说“格式错误”
- 如果表格支持批量编辑,每个单元格的输入事件要独立处理,别共用一个正则全局变量
真正难的不是写正则,而是把 input 和 paste 两个入口都堵死,且不干扰 Layui 自身的 focus/blur 行为。很多项目漏掉 paste 监听,一粘贴就破防。











