form.render() 动态验证失效的根本原因是 DOM 渲染与表单重渲染节奏不同步；需确保父容器有 layui-form 类、用 setTimeout 或 promise 延迟渲染、select 必须含空 option、自定义规则应基于 item.name 正则匹配、删除控件需同步清理值/提示/DOM 类、layer 弹窗须在 success 回调中按 filter 精准渲染。
form.render() 调用后 lay-verify 仍不生效？
根本不是规则没写对，而是 dom 插入和渲染没对上节奏。layui 的 form.render() 只扫描当前已挂载的 dom 节点，js 动态插入后若立即调用，浏览器可能还没完成重排（reflow），导致元素“存在但不可见”，form.render() 找不到它。
常见错误现象：lay-verify="required" 在静态 HTML 里有效，动态拼接 <select> 或 <input> 后点击提交无任何提示；控制台也无报错。
- 确保父容器有
class="layui-form"—— 缺失这个 class，form.render()直接跳过整个区域 - 插入 DOM 后加一层保险：用
setTimeout(() => form.render('input'), 0)或$(...).html(htmlStr).promise().done(() => form.render('input')) - 如果新增的是
<select>，必须先塞一个空<option value=""></option>，否则lay-verify="required"判定为“已选中”，跳过验证
自定义验证规则匹配不到动态 name？
form.verify({ 'phones[]': ... }) 这种写法在动态场景下基本无效 —— 数组语法 name="phones[]" 会被浏览器转义，Layui 内部 key 匹配失败；带序号的 name="phone_2" 更没法穷举。
正确做法是注册一个通用规则名，靠 item 参数反查 DOM 属性：
form.verify({
dynamicPhone: function(value, item) {
// 只对 name 符合 phone_x 模式的 input 生效
if (/^phone_\d+$/.test(item.name) && !/^1[3-9]\d{9}$/.test(value)) {
return '请输入有效的手机号';
}
}
});
- 规则名（如
dynamicPhone）是任意字符串，不依赖 name 值 -
item是当前触发验证的 DOM 元素，可读取item.name、item.className等做条件判断 - 别在
lay-verify属性里写管道符分隔多个规则（如lay-verify="required|dynamicPhone"），Layui 会按顺序执行，但只要前一个规则返回字符串就中断，后续规则不触发
删除动态表单控件后校验还报错？
直接 $(elem).remove() 会导致 layui 内部状态残留：已移除的 <input> 仍被记在验证队列里，提交时弹出“xxx 不能为空”这种幽灵提示。
必须同步清理三处：
- 清空值：
$(targetInput).val('') - 删提示 DOM：
$(targetInput).next('.layui-form-danger').remove() - 清父级状态类：
$(targetInput).closest('.layui-form-item').removeClass('layui-form-danger')
极端情况（比如批量删、频繁增删）可调用 form.val('your-filter', {}) 重置整个表单数据，但注意这会清空所有已填内容，慎用。
layer 弹窗里表单验证失效？
layer.open 创建的弹窗 DOM 是 append 到 <body> 的新节点，不在初始页面结构内，所以初始化时的自动渲染完全不覆盖它。
关键不是“要不要渲染”，而是“在哪一刻、对哪个范围渲染”：
- 必须在
layer.open的success回调里操作，此时 DOM 已真实挂载 - 优先用带 filter 的精准渲染：
form.render('select', 'user-form')，对应 HTML 中<select lay-filter="user-form"> - 避免写
form.render('all')—— 它会重刷所有表单，可能把用户刚选好的值、已展开的下拉框状态全干掉
动态表单验证失效的根因从来不是“Layui 不支持”，而是状态管理没跟上 DOM 生命周期 —— 插入、渲染、删除，每个环节都得手动对齐，漏一环就断链。
