Layui表格checkbox列头点击仅全选当前页，因checkStatus()仅管理当前页数据；若需全选所有页，须手动接管表头事件并收集全部ID，服务端分页需重新请求全量数据，前端分页则可直接操作；还需区分视觉全选与业务全选，后者依赖后端批量接口支持。
layui table 的 checkbox 列不响应表头点击？
默认情况下，layui 表格的 checkbox 列表头点击只触发「全选/反选当前页」，不会自动选中「该列所有数据（含翻页后）」。这不是 bug，是设计如此——layui 的 table.checkstatus() 只管理当前页渲染出的行。
想实现「点表头就选中整列全部数据（无论多少页）」，必须自己接管表头点击事件，并手动收集所有数据 ID 或索引。前提是你的表格启用了服务端分页或已加载全部数据。
- 如果用的是服务端分页（
url配置），浏览器本地根本不知道第 2 页有哪些数据，无法真正「全选所有」，只能发新请求重新拉取全量再选 - 如果用的是前端分页（
data直接传数组），且数据量不大（table.cache['your-id'] 拿到全部原始数据 - 别直接操作 DOM checkbox 元素，Layui 内部状态和 DOM 不同步会导致
checkStatus返回错误结果
如何给 layui 表头 checkbox 添加自定义点击逻辑？
不能靠重写 cols 配置里的 type: 'checkbox'，得在表格渲染完成后，用 jQuery 绑定表头 checkbox 的 click 事件，并阻止默认行为。
关键点：表头 checkbox 的 class 是 layui-table-patch，但更稳的方式是用属性选择器定位 lay-type="all" 的元素；同时要确保事件绑定时机在 table.render() 的 done 回调里。
- 在
done: function(res, curr, count) { ... }中执行绑定，此时 DOM 已就绪 - 用
$('thead .layui-table-patch input[lay-type="all"]')精准选中表头全选框 - 调用
event.preventDefault()，否则 Layui 会先执行自己的全选逻辑 - 之后调用你自己的全选函数，比如
selectAllColumnData()
table.checkStatus() 为什么拿不到跨页选中项？
因为 table.checkStatus('your-id') 返回的对象中 data 字段，只包含当前页被勾选的行数据（即 DOM 里实际存在的 tr 对应的数据），不是整个数据源。这是性能妥协——Layui 不会在内存里维护所有页的勾选状态。
如果你需要「记住跨页选择」，必须自己维护一个全局数组，比如 window.selectedIds = new Set()，每次勾选/取消都增删 ID，并在提交前合并去重。
- 监听
table.on('checkbox(your-filter)', ...)事件，在回调里更新Set - 表头全选时，遍历
table.cache['your-id']，把每条数据的唯一标识（如id字段）加入Set - 注意：
table.cache是原始 data 数组的副本，字段名要和你传入的data一致，不是渲染后的field
完整可运行的小示例（前端分页场景）
假设你表格 ID 是 userTable，数据有 id 字段，且用的是前端分页：
table.render({
elem: '#userTable',
data: userDataArray, // 已加载全部数据
cols: [[
{type: 'checkbox'},
{field: 'username', title: '用户名'},
{field: 'email', title: '邮箱'}
]],
done: function(res, curr, count) {
// 绑定表头全选点击
$('thead .layui-table-patch input[lay-type="all"]').off('click').on('click', function(e) {
e.preventDefault();
const cache = table.cache['userTable'];
const checked = this.checked;
const ids = cache.map(item => item.id);
if (checked) {
ids.forEach(id => selectedIds.add(id));
} else {
ids.forEach(id => selectedIds.delete(id));
}
});
}
});
// 全局选中 ID 集合
const selectedIds = new Set();
// 监听行内 checkbox 变化
table.on('checkbox(userTable)', function(obj) {
if (obj.checked) {
selectedIds.add(obj.data.id);
} else {
selectedIds.delete(obj.data.id);
}
});
真正麻烦的永远不是点一下的事，而是你得想清楚：用户点了表头全选，到底要「视觉上全勾」还是「业务上真全选」。前者改 DOM 就行，后者得和服务端约定好批量操作接口，不然前端勾完了，提交时发现后端根本不认这个“全选”语义。
