Layui下拉框选中时触发确认弹窗需在form.on('select(...)')回调中调用layer.confirm，用户点击“确定”后执行业务逻辑，点击“取消”则手动回滚value和显示文本并render，不可用return false拦截。
layui下拉框（select）如何在选中时触发确认弹窗
直接改 layui.form.on('select(...)') 的回调函数，在里面调用 layer.confirm 即可，但要注意：不能直接在回调里执行实际操作，得等用户点击“确定”后再处理选中值，否则会因异步导致表单状态错乱。
常见错误是把 layer.confirm 放在监听回调里却没阻断默认行为——Layui 的 select 事件是“事后触发”，值已经改了，弹窗只是补救，不是拦截。
- 必须用
layer.confirm的回调函数来更新真实业务逻辑（比如提交、跳转、赋值），而不是在 confirm 外层直接操作 - 如果想“阻止选中”，只能靠视觉还原：先记录原值 → 弹窗 → 用户点取消 → 手动重置
select的 value 和显示文本 - 别用
return false或event.preventDefault()，Layui 的 select 事件不支持取消
怎么还原被取消的下拉选项（避免脏状态）
用户点了“取消”，但 DOM 中 select 的 value 和 lay-select 元素的显示文字已经变了，必须手动回滚。
关键点在于提前缓存上一个选中的值，并在 confirm 的 cancel 回调里恢复。Layui 不提供“选中前”钩子，只能自己记。
- 用闭包或外层变量存
lastSelectedValue，在form.on('select(xxx)')开头读取当前值作为“新值”，然后对比决定是否弹窗 - 恢复时要同时改原生
select的value、触发form.render('select')、再手动更新 lay-select 的显示文案（Layui 1.x 需要操作.layui-form-select dl dd.layui-this，2.x 推荐用form.val） - 示例片段：
let lastVal = $select.val(); // 初始化时读一次 form.on('select(status)', function(data){ const newVal = data.value; if (newVal !== lastVal) { layer.confirm('确认切换状态？', function(index){ // 真实处理逻辑 lastVal = newVal; layer.close(index); }, function(index){ // 用户点取消 $select.val(lastVal); form.render('select'); layer.close(index); }); } });
为什么不能用 onchange + return false 拦截
因为 Layui 的 select 是封装后的伪下拉，原生 onchange 事件基本无效；且其渲染后的真实 select 元素是隐藏的，绑定原生事件也捕获不到用户交互。
强行给 .layui-form-select 绑 click 或 mousedown，会干扰 Layui 内部的展开/收起逻辑，导致下拉菜单无法正常关闭或重复触发。
- 唯一可靠入口就是
form.on('select(XXX)')，这是 Layui 提供的语义化事件通道 - 试图用
event.stopImmediatePropagation()或禁用元素，都会让表单校验、联动更新等功能失效 - 移动端尤其要注意：confirm 弹窗在 iOS Safari 下可能被拦截，需确保域名已加白名单或使用 HTTPS
多个下拉框共用确认逻辑怎么复用
把弹窗逻辑抽成函数，传入字段名、提示文案、确认后回调即可，避免每个 form.on 里重复写 layer.confirm。
注意：不同下拉框可能需要不同的校验条件（比如某些值不弹窗），所以判断逻辑仍需保留在监听回调内，复用的只是弹窗和回滚部分。
- 推荐签名：
confirmSelectChange(field, msg, onOk, onCancel)，其中onOk(data)接收 event.data - 内部自动处理 lastVal 缓存、render、回滚，外部只关心业务分支
- 别把
form.on放进循环里动态注册——Layui 不支持重复绑定同一 field，会覆盖前一个
