layui中监听select必须用form.on('select(filtername)')，需设lay-filter属性、包裹在layui-form内、动态插入后调用form.render('select')刷新，原生change事件无效。
form.on('select(filterName)') 是唯一可靠入口
直接监听 form.on('select(filterName)')，不是原生 change，也不是 click。Layui 渲染后会隐藏原生 select，真实交互发生在它生成的面板里，原生事件大概率不触发或延迟响应。
必须给目标 select 标签加上 lay-filter="xxx"，否则 form.on() 找不到监听目标。回调函数里的 data.value 就是当前选中值，别再写 $(data.elem).val() 多此一举。
如果这个下拉框在弹窗、Tab 页或 JS 动态插入的 DOM 中，确保 form.on() 在 layui.use(['form'], function() { ... }) 内执行，且对应 DOM 已挂载完成。
刷新下游组件前先清空 + 禁用 + 加载态
用户快速切换选项时，前一个请求还没返回，后一个已发出，结果旧响应覆盖新状态——这是最常踩的竞态坑。Layui 不处理这个，得自己控。
- 发起请求前，先把下游组件（比如另一个
select或table）设为禁用：$('#downstreamSelect').prop('disabled', true) - 同时清空非占位项：
$('#downstreamSelect option:not(:first-child)').remove()，避免重复叠加 - 可临时插入加载提示：
$('#downstreamSelect').html('<option value="">加载中…</option>') - 请求成功后恢复启用：
$('#downstreamSelect').prop('disabled', false)
刷新 select 必须调用 form.render('select')
拿到 AJAX 响应后，不能只写 $('#targetSelect').html(htmlStr) 就完事。Layui 的点击逻辑、选中态、搜索功能全靠 form.render('select') 重建 DOM 结构和事件绑定。漏掉这步，下拉框看起来有内容，但点不动、选不中、甚至控制台报 Cannot read property 'value' of undefined。
注意两点：
- 如果页面有多个表单区域，建议加 filter 参数：例如
form.render('select', 'myFormFilter')，避免误刷其他区域 - 若需默认选中某项，除了
$('#targetSelect').val(value)，还得手动设selected属性：$('#targetSelect option[value="' + value + '"]').prop('selected', true)
刷新表格单元格里的 select 要绕过 table.reload()
在 Layui 表格中做联动时，千万别调 table.reload() 或直接改 table.cache 后等自动同步——这会销毁正在编辑的 select，用户操作中断，保存时还是旧值。
正确做法是局部更新：
- 用
$(tr).find('[name="' + targetField + '"]')定位目标单元格内的select - 设置新值并触发 change：
.val(newVal).trigger('change') - 同步缓存：
table.cache['tableId'][rowIndex][targetField] = newVal - 如果该列用了
templet，还要重生成 HTML 并$(td).html(newHtml)，最后再form.render('select')
四个动作缺一不可，尤其容易忽略的是缓存同步和 form.render('select') 的组合调用。
