Layui复选框必须用form.on('checkbox(filterName)')监听，filterName需与lay-filter值严格一致；data.value仅返回当前操作项value，获取全部选中值需手动遍历DOM；全选/反选须操作原生checked属性并调用form.render()同步UI。
form.on('checkbox(filterName)') 是唯一可靠监听方式
直接给 <input type="checkbox"> 绑原生 click 或 change 事件会失效——Layui 渲染后真实 input 被隐藏，UI 层是模拟的 div，原生事件根本触达不到。你点的是美化层，DOM 状态却没同步，data.elem.checked 拿到的可能是旧值。
必须用 form.on('checkbox(filterName)')，且 filterName 必须和 HTML 中 lay-filter="xxx" 的值**严格一致**（大小写、空格、符号都不能差）。这个事件由 Layui 内部事件代理触发，能穿透所有渲染场景：动态加载、分页重载、AJAX 刷新后都有效。
-
filterName是lay-filter的值，不是name，也不是 ID - 监听必须在
layui.use(['form'], function() { ... })回调内注册，不能提前声明form实例 - 多个复选框区域共存时（如权限区 + 用户列表），每个区域要用不同的
lay-filter，否则一个勾选会触发全部回调
data.value 只反映当前操作项，不是全部选中值
data.value 是当前被点击的那个 checkbox 的 value 属性值，不是整组选中的集合。常见错误是以为 data.value 就是“这次选中的值”，结果全选时它为 undefined（因为全选框通常不设 value），单选取消时它还是上一次的值。
要获取全部已勾选的值，得手动查 DOM：
form.on('checkbox(userRoles)', function(data) {
var checkedValues = [];
$('input[name="userRoles"]:checked').each(function() {
checkedValues.push(this.value);
});
console.log(checkedValues); // ['admin', 'editor']
});
-
name="userRoles"是表单字段名，必须和所有目标 checkbox 的name属性一致 - 不能依赖
form.val('formFilter')批量取值——它对复选框只返回最后一个操作项的值，不是数组 - 如果 checkbox 是动态生成（如弹窗里插入的），确保先执行
form.render('checkbox')再绑定监听
全选/反选逻辑别硬设 prop，要操作原生 checked 属性
全选按钮本身也是 checkbox，它的 lay-filter 和子项 name 通常不同。监听时拿到 data.elem.checked，然后遍历子项并赋值 item.checked = data.elem.checked，最后调用 form.render('checkbox') 同步 UI。
千万别用 $('input[name="xxx"]').prop('checked', true) —— 这只改 DOM 属性，Layui 渲染层感知不到，UI 和内部状态会脱节，后续 form.val() 或校验可能出错。
- 子项定位推荐按
name（如input[name="userIds[]"]）或加特定 class（如.role-check），避免全局input[type="checkbox"]误伤 - 反选逻辑写成
item.checked = !item.checked，而不是先全清再重设，减少 DOM 操作次数 - 反选按钮建议用普通
<button type="button">，不要也做成type="checkbox"，语义混乱且易和全选逻辑冲突
提交前批量取值要注意 name 一致性
form.val('formFilter') 能读取整个表单字段，但对复选框有硬性要求：所有同名 checkbox 必须共享同一个 name，且不能混入其他类型控件（比如同名的 input[type="text"] 会覆盖掉 checkbox 的值）。
后端接收时，PHP 习惯用 name="roles[]"，JS 侧也得保持一致；如果写成 name="roles"，后端只能收到最后一个值。
- 提交时浏览器原生行为会把同名 checkbox 的选中值拼成数组发送，Layui 不干预这一过程
- 若需在提交前校验是否至少选中一项，仍得用
$('input[name="xxx"]:checked').length > 0判断 - 表格内嵌复选框（非独立表单）不走
form.val()，得用table.checkStatus('id')或查 DOM
lay-filter 和 name 的职责混淆——前者只用于事件绑定，后者才决定数据归属。这两个值一旦写反或复用，监听就失灵，而且问题很难一眼看出来。 
