直接清空 lay-verify 属性需配合 form.render() 重载表单并移除原生 required 属性,否则缓存规则仍生效;推荐用 form.verify 动态覆盖校验规则以实现条件性跳过。
直接清空 lay-verify 属性即可移除必填校验,但要注意 dom 更新后需重新渲染表单或触发校验重置,否则旧规则仍可能生效。
清空 lay-verify 属性的正确写法
单纯用 jQuery 的 .attr('lay-verify', '') 或原生 element.removeAttribute('lay-verify') 能删掉属性,但 Layui 的 form 模块在初始化后会缓存校验配置,不主动刷新的话,提交时仍按旧规则校验。
- 推荐做法是先清空属性,再调用
form.render()重载表单结构 - 若只针对单个元素(如
#behalf_packageAmount),可配合form.verify动态覆盖规则,而非硬删属性 - 避免写成
$('#x').attr('lay-verify', 'required')再删——这反而会激活校验
使用 form.render() 重载表单的时机
修改 lay-verify 后必须调用 form.render(),否则 DOM 变了但 Layui 内部状态没同步,校验逻辑不会更新。
- 适用于整个表单区域:如
form.render('select')或form.render()(重载全部) - 如果只改了一个 input,且它在
.layui-form容器内,调用form.render()即可,不用指定类型 - 注意:
form.render()不会触发表单验证,只是刷新 UI 和内部绑定关系
动态禁用校验的替代方案:用 form.verify 覆盖规则
比直接删属性更稳妥的方式,是用自定义验证函数返回 true 或空字符串,让校验“通过”而不是“不存在”。适合需要条件性跳过校验的场景(如字段隐藏时)。
- 示例:将
lay-verify="required"的字段临时绕过 - 在
form.verify中添加:
form.verify({
optional_required: function(value, item) {
// 判断该字段是否应跳过校验,比如父容器被 hide
if ($(item).closest('.intention').is(':hidden')) {
return true; // 不报错,视为通过
}
}
});
然后把原字段改为 lay-verify="optional_required"。
容易忽略的坑:name 属性和浏览器原生校验干扰
Layui 校验依赖 lay-verify,但浏览器原生的 required 属性也会触发弹窗提示,两者并存会导致重复校验或样式冲突。
- 务必同时移除
required属性:$('#x').removeAttr('required') - 有些项目还会给 input 加
name属性用于提交,但若该字段已废弃校验,建议也清空name(如$('#x').attr('name', '')),避免后端收到空值 -
autocomplete="off"虽不直接影响校验,但在某些 Chrome 版本中会影响输入框聚焦行为,建议一并检查
真正起作用的是「属性清除 + form.render() + 原生 required 移除」三者配合,少一个都可能让校验逻辑残留。特别是表单动态显示/隐藏频繁时,别只靠删属性就以为万事大吉。


















