必须用 click 事件配合 preventdefault() 拦截单选框切换，再调用 layer.confirm；change 事件触发时已选中，无法实现“先确认后操作”。
点击单选框前拦截并弹出 confirm
Layui 本身不提供「点击单选框自动弹 confirm」的内置行为，必须手动绑定 click 事件并阻止默认切换，再调用 layer.confirm。关键在于：不能用 change 事件（它发生在已选中之后），必须用 click 并配合 event.preventDefault()。
- 单选框（
<input type="radio">）默认点击即切换状态，要弹确认框就得先拦住这个动作 -
layer.confirm是异步的，不能直接在click回调里写「确认后赋值」，否则会丢失原始点击目标 - 需通过
event.target或this拿到当前被点的input元素，后续确认成功再手动设置checked
完整可运行的 DOM + JS 写法
假设页面有一组 name 为 gender 的单选框：
<input type="radio" name="gender" value="male" title="男"><input type="radio" name="gender" value="female" title="女">
对应 JS（需确保 layui 和 layer 已加载）：
// 注意：必须在 layui.use 后执行，或确保 layer 已就绪
document.querySelectorAll('input[name="gender"]').forEach(radio => {
radio.addEventListener('click', function (e) {
e.preventDefault(); // 阻止立即选中
const that = this;
layer.confirm('确定选择「' + that.nextElementSibling.innerText + '」？', {
btn: ['确定', '取消']
}, function () {
that.checked = true; // 确认后才真正选中
// 可选：触发自定义 change 逻辑，如刷新表单状态
that.dispatchEvent(new Event('change', { bubbles: true }));
});
});
});
为什么不用 change 事件？
change 事件触发时，单选框已经完成选中 —— 用户点完就变，confirm 弹出来时状态已改，违背「先确认再操作」的意图。实际调试中常见错误现象：console.log(this.checked) 在 change 回调里永远是 true（对当前项），无法回滚。
- 用户点了「女」→ 单选框立刻切到「女」→
change触发 → 此时再弹 confirm 已无意义 - 若 confirm 点「取消」，UI 上仍是「女」，但业务逻辑可能没同步，造成状态不一致
-
click+preventDefault才能真正「卡住」切换时机
注意 name 相同的单选组与事件委托
如果单选框是动态生成的（比如从 AJAX 加载），直接遍历 querySelectorAll 会漏掉后续新增项。此时应改用事件委托：
document.body.addEventListener('click', function (e) {
if (e.target && e.target.type === 'radio' && e.target.name === 'gender') {
e.preventDefault();
const radio = e.target;
layer.confirm('确定选择「' + radio.nextElementSibling.innerText + '」？', {
btn: ['确定', '取消']
}, function () {
radio.checked = true;
radio.dispatchEvent(new Event('change', { bubbles: true }));
});
}
});
注意：事件委托下，nextElementSibling 依赖 HTML 结构（label 必须紧邻 input），若用 lay-radio 或封装组件，需改用 radio.getAttribute('title') 或自定义 data-desc 属性取文案。
