应使用 table.on('checkbox(filter)', callback) 监听 Layui 表格复选框，通过 table.checkStatus('id').data.length 获取当前页已选行数，确保每个表格 id 和 lay-filter 唯一，避免事件干扰与性能问题。
监听 Layui 表格内 checkbox 的实时选中数量，靠 on('checkbox') 事件
layui 表格的复选框不是普通 dom，而是通过 render 后动态生成的模拟控件，直接用 change 或 click 监听无效。必须用表格实例的内置事件系统——on('checkbox')，它在每次勾选/取消时触发，且自带当前行数据和状态。
常见错误现象：document.querySelectorAll('.layui-table input[type="checkbox"]').forEach(...) 拿不到最新状态，或监听不到渲染后新增的行；用 form.on('checkbox') 只能捕获表单级 checkbox，不适用于表格内部带 lay-skin="primary" 的行内复选框。
- 确保表格初始化时启用了复选框列：
cols: [[{type: 'checkbox'}]] - 监听必须绑定在
table.render()返回的实例上，不能写在layui.use外部 -
on('checkbox')回调参数是对象，含checked（布尔）、data（整行数据）、elem（原始 checkbox DOM）
获取当前已选中行数：别遍历 checkStatus，改用 table.checkStatus 实时查
很多人误以为要手动维护一个计数器，或者每触发一次 checkbox 就去 querySelectorAll 所有已勾选项 —— 这既慢又不准，尤其在分页、重载、搜索后容易出错。
正确做法是每次事件触发时，调用 table.checkStatus 获取当前表格实例的选中状态快照，它返回的对象里 data.length 就是当前页已勾选行数；若需全量（跨页），得配合 id 和 table.cache 自行比对。
-
table.checkStatus('yourTableId')中的'yourTableId'必须和render时传的id一致 - 该方法只返回当前页可见范围内的勾选项，不会包含未渲染的其他页数据
- 如果表格开启了
page: false（无分页），data.length就是全部已勾选项数
注意 lay-filter 值重复导致多个表格事件互相干扰
当页面有多个 Layui 表格时，如果它们的 lay-filter 属性值相同，on('checkbox', 'xxx') 会同时响应所有表格的勾选动作，造成计数混乱或重复执行。
典型表现：点 A 表格的 checkbox，B 表格的监听函数也执行了；或者两个表格共享同一个计数变量，数值翻倍。
- 每个
table.render()必须配唯一id和唯一lay-filter - 事件监听写法应为：
table.on('checkbox(testTable)', function(obj){...})，其中testTable是lay-filter值 - 不要为了“省事”把多个表格共用一个
lay-filter，这是最常被忽略的耦合点
性能提醒：避免在 checkbox 事件里做重操作
on('checkbox') 触发非常频繁（比如按住 Shift 多选、全选反选），如果在里面执行 DOM 遍历、Ajax 请求、复杂计算，UI 会明显卡顿，甚至导致浏览器假死。
真实场景下，多数人只需要更新一个数字 badge 或按钮状态，没必要每次触发都查一遍全量缓存或发请求。
- 如只需显示数量，直接用
table.checkStatus().data.length更新<span id="selectedCount"></span>即可 - 如需后续批量操作，建议把
obj.data缓存在数组里，等用户点击「提交」时再统一处理 - 避免在事件回调中调用
table.reload()或重新render()，这会引发无限循环
