layui单选框checked属性不起作用如何办

Layui单选框无法通过直接设置checked属性或jQuery.prop()生效，因其UI由自定义DOM结构驱动；正确做法是调用form.val()写入值后立即执行form.render('radio')。

直接设 checked 属性或用 jQuery .prop('checked', true) 对 Layui 的单选框（type="radio"）基本无效——它不靠原生 DOM 属性驱动 UI，而是依赖 Layui 自己维护的状态和渲染结构。

为什么 checked 属性不起作用

Layui 把 input[type="radio"] 替换成了自定义 DOM 结构（比如带 layui-form-radio 容器的伪元素），真实 input 被隐藏且只作数据通道。你改它的 checked 属性，Layui 不监听也不响应。

常见问题表现包括：

1. HTML 里写 <input type="radio" name="x" value="1" checked>，页面加载后没打勾
2. $('input[value="1"]').prop('checked', true) 执行了，但 UI 没变化
3. 表单提交时取不到值，form.val() 返回空或旧值

正确做法：必须走 form.val() + form.render('radio')

给单选框赋默认值，唯一可靠路径是先写入数据，再触发 UI 渲染：

1. 确保所有 radio 共享同一个 name（如 name="status"）
2. 调用 form.val('filter-name', { status: '1' }) —— 注意值是字符串，不是数组
3. 立刻跟一句 form.render('radio')（不是 'radios'，拼错就静默失败）
4. 如果 radio 在弹窗、tab 或 AJAX 加载区域里，确保这俩操作在 DOM 插入完成之后执行

示例：

form.val('myForm', { status: '2' }); // 写入值form.render('radio'); // 刷新 UI，缺一不可

动态插入 radio 后仍不生效？检查 DOM 结构合法性

手动拼 HTML 插入 radio，很容易漏掉 Layui 要求的包裹结构，导致 form.render('radio') 找不到目标：

1. 不能只写 <input type="radio" name="x" value="1">选项1
2. 必须按最新结构：<input type="radio" name="x" value="1" title="选项1">，且外层要有 layui-form-item 或至少被 form 容器包裹
3. 如果用了 $.html() 替换整个区域，事件绑定会被清空；改用 $.append() 或 insertAdjacentHTML()
4. 确认父级 <form> 标签有 lay-filter="myForm"，且 form.render('radio', 'myForm') 的第二个参数匹配它

表格里的 radio 单选列，默认选中要另起炉灶

table 的 {type: 'radio'} 列不响应 form.val()，也不能靠数据字段加 checked: true 驱动：

1. 初始化默认选中某行，得等 table.render() 的 done 回调执行完
2. 查 table.cache['filterId'] 找到对应行对象，手动加 lay-checked="true" 属性
3. 或用 table.setRowChecked('filterId', { index: N, checked: true })，但注意 N 是当前页的行下标，翻页后会变
4. 别在 row 事件里反复调 setRowChecked()，容易触发状态抖动，尤其在移动端

真正容易被忽略的是：radio 的“默认选中”和“用户点击选中”走的是两套机制，混用就会不同步。要么全交给 Layui 管理（用 form.val + render），要么全交给 table 模块（用 setRowChecked），不要交叉操作。