layui单选框必须通过form.on('radio(filter)', callback)监听，filter需与radio的name属性一致；直接绑定onclick会因dom被替换而失效，且须确保form模块已加载、dom就绪、动态渲染后调用form.render('radio')。
layui 单选框怎么监听选中变化
layui 的单选框（radio）本身不自动绑定事件，必须通过 form.on('radio(filter)', callback) 主动监听，且 filter 必须与 HTML 中 name 属性一致——这是最常卡住的地方。
常见错误现象：
• 点击没反应，控制台无报错
• 改了其他 radio 但回调不触发
• 回调里取不到当前选中的值
- 确保已加载并初始化 layui 的
form模块：layui.use(['form'], function(){...}) -
form.on()的第一个参数是字符串'radio(你的name值)'，不是 ID 或 class；比如<input type="radio" name="sex" value="1">，就写radio(sex) - 回调函数的
data参数包含elem（当前点击的 DOM 元素）、value（当前选中值）、othis（jQuery 封装对象）
layui.use(['form'], function(){
var form = layui.form;
form.on('radio(sex)', function(data){
console.log(data.value); // 输出 '1' 或 '2'
console.log(data.elem); // 原生 input 元素
});
});
为什么用 form.on 而不是 onclick
layui 的 radio 渲染后会替换原始 DOM，直接写 onclick 会失效；而且 layui 需要统一管理表单状态、校验和重渲染逻辑。
性能影响：每次点击都会触发一次回调，但开销极小；如果内部有复杂计算或异步请求，建议加防抖或节流（如用 setTimeout 缓存一次）。
- 不要在回调里重复调用
form.render()，radio 变化本身不需手动重渲染 - 如果页面动态插入 radio（如 AJAX 加载），需在插入后再次调用
form.render('radio') - 多个同名 radio 组共用一个 filter，不能为每个 radio 单独设监听
获取未选中时的“空值”要注意什么
layui 的 radio 没有“取消选中”功能——用户只能从一个选项切到另一个，不会回到未选中状态。所以 form.on('radio(xxx)') 不会因“反选”触发。
- 若业务需要支持“清空选择”，得自己加一个
value=""的 radio，并设默认不选中（checked不加） - 初始没选中任何项时，第一次点击才会触发回调；之前调
form.val('filter')拿不到值 - 想读取当前所有 radio 组状态，用
form.val('formFilter')（需给form标签加lay-filter="formFilter"）
容易被忽略的是：filter 名称大小写敏感、空格不能出现在 name 值里、动态生成的 radio 必须补 render —— 这三点出问题时，事件看起来就像“完全不响应”。
