table.checkStatus只返回当前页数据是正常行为,因其仅读取当前页DOM勾选快照,不跨页缓存或跟踪ID;需手动用selectedIds数组维护跨页状态,并在done回调中同步视觉与数据。
table.checkStatus 拿不到跨页选中数据,这是正常行为,不是 bug。Layui 表格默认只维护当前页勾选状态,翻页后 DOM 重绘,之前的选择自然丢失。
为什么 table.checkStatus 只返回当前页数据
layui 的 table.checkstatus 本质是读取当前渲染页 dom 中已勾选的行对应的数据快照,它不跟踪历史、不缓存 id、也不跨页关联。服务端分页时每页都是全新请求;前端分页(page: false)虽数据全在本地,但 layui 不自动同步 checkbox 状态到原始数据源。
-
res.data是每次翻页后重新赋值的数组,LAY_CHECKED这类内部标记不会持久化 - 监听
click而非table.on('checkbox(filter)')会漏掉全选操作 - 用
lay-id或数组索引做 key,翻页后映射失效——必须用后端返回的稳定字段(如id)
如何手动维护跨页选中状态
核心是用一个外部数组(比如 selectedIds)记录所有被点过的行 ID,并在每次勾选/取消时增删它。
- 初始化定义:
let selectedIds = []; - 监听事件必须用
table.on('checkbox(yourFilter)', callback),不能用 click - 在回调里根据
obj.type区分单选、全选:obj.type === 'all'时遍历obj.data批量处理 - 增删前先用
includes()或indexOf()去重,避免重复 ID - 别在
done回调里直接改res.data[i].LAY_CHECKED = true—— 这个字段会被下一次渲染覆盖
翻页后怎么恢复 checkbox 视觉状态
Layui 不自动还原,得你手动同步 DOM 和内部状态。
- 在
done回调里遍历当前页每行数据:res.data.forEach(row => { ... }) - 对每个
row.id,检查是否在selectedIds中,若是则:
– 设置row.LAY_CHECKED = true(仅用于视觉标记,不影响逻辑)
– 用 jQuery 找到对应 checkbox:$(`tr[data-row-index="${i}"] input[type=checkbox]`).prop('checked', true).addClass('layui-form-checked') - 如果用了服务端分页,
res.data没带LAY_TABLE_INDEX,得自己用findIndex匹配 - 不要在
done里调table.reload()—— 会清空你刚设的LAY_CHECKED
导出或提交时怎么拿到全部选中行原始数据
没有“一键获取全部”的 API。你只能靠 selectedIds + 数据源拼合。
- 前端全量缓存:渲染前把全部数据存进
allDataMap = new Map(),key 是id,导出时循环selectedIds取值 - 后端批量查询:传
{ ids: selectedIds }到接口,后端用WHERE id IN (...)查,更稳妥,尤其数据量大时 - 导出按钮必须加校验:
if (selectedIds.length === 0) return,否则后端可能因空参数报错 - 注意:如果表格启用了
loading: true,checkStatus在加载中可能返回空数组,得等done后再取
table.reload())会清空所有前端缓存的状态,包括你辛苦维护的 selectedIds —— 如果没在 where 或 initSort 里主动恢复,翻页或搜索后就归零了。











