jQuery DataTable分页后第二页选中行无法删除，求解决方案

跨分页选中行无法删除的核心原因是：jQuery DataTable 出于性能优化，只会将当前分页的行节点渲染到DOM树中，其余分页的行节点不在当前文档流内。你现有的代码依赖jQuery选择器读取DOM元素的选中状态、直接序列化表单，都只能拿到当前页的有效数据，自然无法识别其他分页的选中行。

• 第一步：废弃纯依赖DOM判断选中状态的逻辑
  不用jQuery选择器直接查页面上的复选框，改用DataTable API遍历所有符合搜索条件的行，不管是否在当前分页，都能正确拿到行内复选框的状态。
• 第二步：修正选中数量校验、参数拼接逻辑
  不要直接序列化表单，从遍历拿到的选中数据里提取要提交的参数即可，避免漏拿非当前页的选中值。

// 遍历所有符合搜索条件的行，收集选中的ID，不受分页限制
const selectedIds = [];
table.rows({ 'search': 'applied' }).every(function() {
    const rowCheckbox = $(this.node()).find('input[type="checkbox"]');
    if (rowCheckbox.is(':checked')) {
        selectedIds.push(rowCheckbox.val());
    }
});

if (selectedIds.length >= 2) {
    if (confirm('Are you sure ?')) {
        // 手动拼接提交参数，不用序列化表单
        $.post(url, { delete_ids: selectedIds })
        .fail((errors) => {
            alert('Can\'t delete data');
            return;
        });
    }
} else {
    alert('Select the data to be deleted!');
    return;
}

如果已经引入DataTable官方Select扩展，可以简化写法，直接调用内置API获取选中行：

const selectedRows = table.rows({ selected: true, search: 'applied' });
const selectedIds = selectedRows.data().toArray().map(item => item.product_id);

小提示：如果是服务端分页场景，非当前页的行数据本身不存在于前端，需要额外在全选、单选事件触发时，自行维护一个全局数组存储选中的ID，提交时直接传这个数组即可。

内容的提问来源于stack exchange，提问作者Ari Mursandhi