Layui select 级联失效主因是监听过早、未及时 form.render() 或状态未重置；须在 DOM 插入后绑定事件，动态填充后调用 form.render('select', 'filter')，三级联动需禁用下级、清空选项、隐藏面板并重绘。
必须手动监听 change 事件，Layui 原生 select 不识别 data-url，也不内置级联逻辑。
为什么 form.on('select(xxx)') 绑定后联动没反应
常见原因是 DOM 不存在时就注册了监听。比如城市 select 是空容器，靠省份请求成功后才动态插入的，但你在页面加载时就写了 form.on('select(city)', ...)——这个监听根本不会生效。
- 把监听代码放到目标
select插入 DOM 后执行（例如在省份请求的success回调末尾） - 或者改用原生事件委托：
$('form').on('change', 'select[name="city"]', function(){...})，绕过 layui 的注册时机限制 - 检查是否重复调用了
form.render('select')，多次渲染会覆盖已绑定的事件
动态填充 option 后下拉框还是空白或无法点击
不是数据没加进去，而是 UI 没同步。Layui 不会自动感知 JS 新增的 option，必须显式重绘。
- 每次
html()或append()前，先清空：$('#city').empty() - 填完新选项后，立即调用
form.render('select', 'your-filter')，第二个参数是所在form的lay-filter值 - 漏掉
form.render()是导致“看着有选项、点不了/选不中/值为空”的最常见原因
三级联动时区县选项残留上一次城市的旧数据
只清空 option 不够，还要重置状态和 UI 可见性。
- 切换上级时，先禁用下级：
$('#district').prop('disabled', true) - 清空并插入提示项：
$('#district').html('<option value="">请选择区县</option>') - 隐藏其 layui 封装的下拉面板容器（
.layui-form-select），避免用户看到旧展开态 - 最后再调用
form.render('select')，确保禁用态和新选项都生效
多级联动真正难的不是写几个 ajax，而是让每次请求、每次 DOM 更新、每次 form.render() 都对齐——尤其在用户快速连点时，请求顺序、UI 状态、缓存值三者稍有错位，就会出现选项错乱或值丢失。
