必须在 layui.use(['form'], function(){}) 内部、form.render() 之前注册 form.verify() 自定义规则,使用唯一 id 和 layui.$ 取值,空值需主动判断,动态表单需重注册,隐藏字段须移除 lay-verify 属性。

直接用 form.verify() 定义一个自定义规则,再绑定到「确认密码」输入框的 lay-verify 属性上,就能实现两次密码比对。关键不是“怎么写”,而是“在哪注册、怎么取值、怎么防错”。
必须在 layui.use 回调里注册验证规则
规则必须在 layui.use(['form'], function(){...}) 内部执行,且要在 form.render() 之前完成注册。否则规则不生效——Layui 的 form 模块还没加载完,form.verify() 就是空操作。
- 错误写法:
form.verify()放在layui.use外,或放在form.render()之后 - 正确顺序:先
layui.use→ 再form.verify()→ 最后form.render() - 规则名(如
repass)必须是字符串,不能和内置规则(required、password)重名,否则被覆盖
取值要用 layui.$ 或原生 DOM,别混用 jQuery
Layui 自带的 layui.$ 是 jQuery 兼容版,但和页面中独立引入的 jQuery 不一定共用同一个 $。如果页面同时有 jQuery 和 Layui,用 $('#pwd1') 可能取不到元素,尤其在多模块加载场景下。
- 推荐统一用
layui.$('#pwd1').val()或document.getElementById('pwd1').value - 不要在验证函数里写
$('#pwd1').val(),除非你确定全局$就是 jQuery 且已就绪 - 注意:目标输入框必须有唯一
id,多个表单共用同一套 JS 时,重复id="pwd1"会导致只取到第一个
空值处理和动态渲染要手动补全
默认规则只在校验触发时运行(比如 blur 或提交),但如果用户先输密码、再清空确认密码框,错误提示不会自动消失——Layui 不监听其他字段变化。
- 建议加空值判断:
if (!value) return;,避免空字符串触发比对失败 - 表单是 Ajax 动态插入的?必须在
form.render()后重新执行form.verify(),Layui 不自动重载规则 - 隐藏了密码字段(如编辑页不改密码)?得同步移除其
lay-verify属性,否则仍会校验
中文输入法和实时监听容易翻车
如果你自己加了 input 实时监听并手动触发验证,中文输入过程中(拼音未上屏)的中间态 value 会导致比对失败。但 Layui 原生验证默认只绑 blur 和 submit,一般不受影响。
- 真要实时校验,必须加
event.isComposing判断:if (event.isComposing) return; - 别在验证函数里做防抖——Layui 对验证本身已有节流,额外加反而可能阻断正常反馈
- 确认密码字段修改后,主密码字段变了,但确认框的错误状态不会自动清除,需手动调用
form.validate()或重置验证状态
最常被忽略的是:规则注册时机、ID 唯一性、以及隐藏字段未清理 lay-verify 属性这三处。写完跑通一次不等于稳,换场景(比如弹窗表单、Tab 切换页)很可能当场失效。


















