Layui下拉框渲染失败的根本原因是DOM未挂载、缺少layui-form容器包裹或form.render()调用时机错误；必须确保select在class="layui-form"内、动态插入后立即调用form.render("select", "filter")、赋值前先渲染且选项已存在。
form.render("select") 调了但下拉框还是原生样式
根本不是代码没执行，而是 Layui 根本没“看到”这个 select 元素——它只扫描带有 class="layui-form" 的父容器内的表单元素。
- 检查 DOM：目标
select的最近祖先节点是否带class="layui-form"；没有就加，不能靠后代自动识别 - 错误写法：
- 正确写法：
（form标签同理） - 如果用了
laytpl或layer.open动态插入 HTML，必须确保插入后 DOM 已挂载再调form.render("select")
动态填完 option 后下拉框显示为空
你拼的 HTML 没问题，append() 也成功了，但 Layui 不监听 DOM 变更，必须手动通知重绘。
- 清空用
.empty()，别用.html("")，某些版本会破坏 Layui 封装结构 - 插入新
后，立即执行form.render("select", "your-filter")（第二个参数是select所在容器的lay-filter值） - 确保每个
都有合法value属性，否则后续form.val()匹配失败 - 所有操作必须包在
layui.use(["form"], callback)内，否则form是undefined
赋值成功但 UI 不选中
form.val("filter", {name: "value"}) 返回值正确 ≠ 视觉更新，常见于“值存在”和“选项存在”不一致。
- 顺序必须是：改 DOM →
form.render("select", "filter")→form.val("filter", {...}) -
form.val()中的键名（如name）必须和select的name属性完全一致（大小写、拼写） - 不能用 jQuery 直接设
$("#mySelect").val("xxx")，Layui 内部状态不同步 - 确认对应
value="xxx"的已存在于 DOM 中，且已被form.render()处理过
layer 弹层里 select 渲染失效
弹窗内容是动态插入 body 的新 DOM 节点，初始化时的自动渲染完全不生效，必须补渲染。
- 不要在
layer.open()外提前调form.render()，也不要等用户点击后再操作 - 必须在
success回调里执行：form.render("select", "your-filter") - 如果弹窗内容来自已有 DOM 节点（如
content: $('#myForm')），layer会 clone 并重置事件，必须重新渲染 - 避免无参调用
form.render()，容易误刷其他区域；优先传"select"和具体lay-filter
真正卡住的地方往往不是语法，而是 DOM 是否已挂载、layui-form 是否包裹到位、以及 form.render() 是否在正确的上下文和时机执行。这三个条件缺一不可。
