表格行内复选框必须通过data-id或value绑定唯一业务ID，严禁依赖DOM索引；批量删除时只采集已勾选复选框的value或dataset.id，构造{ids:[123,456]}格式请求，成功后按ID精准移除对应tr并同步状态。
表格行内复选框怎么绑定到 data-id 而不是索引
直接用 index 做删除依据非常危险——数据翻页、筛选或排序后，索引就失效了。必须让每行明确携带唯一标识。
正确做法是在 后续批量操作时，只取 RESTful 风格倾向用 后端接收方式决定前端构造方式。常见且兼容性最好的是： 整页重载或 关键动作有三步：收集 ID → 发请求 → 成功后移除对应行（用 Bootstrap 自带的 checkbox 样式不影响逻辑，但事件绑定容易出错：用 典型结构： 监听和同步逻辑要双向： 实际批量删除最常卡住的地方，不在样式或按钮，而在 ID 的来源是否稳定、请求是否幂等、以及 DOM 移除后分页总数有没有重新计算。这些环节一松动，用户就会遇到“明明删了却还在列表里”或者“删完跳回第一页但数据显示错乱”。 或复选框上挂真实 ID： <tr data-id="123">
<td><input type="checkbox" value="123"></td>
<td>用户A</td>
</tr>
input:checked 的 value（或从父 读 data-id），不依赖 DOM 位置。
$('tbody input').eq(i).val() 这类基于顺序的写法id 字段透传进 checkbox 的 value
.table 样式本身不干涉这个逻辑，但要注意自定义 checkbox（如用 form-check-input）时别漏掉 value
$.ajax 批量删除请求体该用 POST 还是 DELETE？参数放哪DELETE + 请求体传 ID 数组，但部分老浏览器或代理会拦截带 body 的 DELETE。生产环境更稳妥的选择是 POST 到 /api/users/batch-delete。$.ajax({
url: '/api/items/batch-delete',
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({ ids: [123, 456, 789] }),
success: function(res) { /* ... */ }
});
traditional: true 拼 query string（如 ?ids[]=123&ids[]=456），ID 多了容易超 URL 长度限制application/x-www-form-urlencoded），就改用 data: { ids: [123, 456] }，jQuery 会自动序列化contentType 声明，否则后端可能收不到 JSON body删除后表格局部刷新怎么做才不闪、不丢状态
location.reload() 看似简单，但会丢失当前页码、搜索关键词、排序方向等状态。应该只删 DOM 节点，并同步更新分页数据。data-id 精准定位）：const idsToDelete = $('tbody input:checked').map((i, cb) => cb.value).get();
if (!idsToDelete.length) return;
<p>$.post('/api/items/batch-delete', { ids: idsToDelete }).done(() => {
idsToDelete.forEach(id => $('tr[data-id="' + id + '"]').remove());
// 可选：更新页脚文字，如 “共 24 条，已显示 10 条”
});</p>
$('tbody tr').filter(':has(input:checked)') —— 效率低，且在复杂模板中易误匹配bootstrap-table），优先调用其 removeByUniqueId 方法，它会自动维护内部缓存“全选”复选框和子项联动的坑在哪
change 而不是 click，并注意冒泡干扰。<thead>
<th><input type="checkbox" id="check-all"></th>
</thead><tbody><tr><td><input type="checkbox" value="123"></td></tr></tbody>
$('#check-all').on('change', ...) 控制所有子项 checked 状态.on('change', ...) 去反推全选框状态（比如 5 行里勾了 4 行，全选框应为 indeterminate，但原生 checkbox 不支持，得用 JS 模拟或换组件）$('#check-all').prop('checked', true) —— 这会导致全选框变化又触发一次 change，无限循环prop('indeterminate', true) 设置半选态时，记得之后手动设 checked 为 false，否则点击后行为异常
