如何检测DataTable列是否正在重排序？解决新增行报错问题

爬取亚马逊商品数据时，每获取一件商品就向DataTable新增一行。但在列重排序过程中新增行，会触发“列数不一致”的报错。尝试通过判断table.colReorder.order()的长度是否等于总列数（15）来控制新增时机，但拖动列时该方法仍返回15个元素，无法识别重排序状态，求可行的检测方法。

尝试的核心代码：

if (table.colReorder.order().length == 15) { // 15是总列数
  $("table")
    .DataTable()
    .row.add($(productObjRowHtml(productObj)))
    .draw(); // 添加商品
} else {
  setTimeout(addProduct, 1000, productObj, table); // 延迟后再尝试添加
}

完整代码：

var table = $("table").DataTable(tableDefinition);

function addProduct(ProductObj, table) {
  var tableColumnOrder = getTableColumnOrder(table)
  if (tableColumnOrder.length == 15) {
    $("table")
      .DataTable()
      .row.add($(productObjRowHtml(ProductObj)))
      .draw();
  } else {
    setTimeout(addProduct, 1000, ProductObj, table);
  }

}

function getTableColumnOrder(table) {
  var columnOrder = table.colReorder.order()
  return [...columnOrder]
}

利用DataTables ColReorder插件提供的重排序前后事件标记表格状态，是最可靠的检测方式：

1. 新增全局变量标记重排序状态

var isReordering = false; // 标记是否正在进行列重排序

2. 绑定ColReorder的起止事件

table.on('colReorder:beforeReorder', function() {
  isReordering = true; // 开始拖动列时标记为正在重排序
});

table.on('colReorder:afterReorder', function() {
  isReordering = false; // 拖动结束、列位置确定后取消标记
});

3. 修改addProduct函数，通过状态变量判断是否允许新增行

function addProduct(ProductObj, table) {
  if (!isReordering) {
    $("table")
      .DataTable()
      .row.add($(productObjRowHtml(ProductObj)))
      .draw();
  } else {
    setTimeout(addProduct, 300, ProductObj, table); // 缩短延迟间隔，提升响应速度
  }
}

补充说明 #

• colReorder:beforeReorder在用户开始拖动列时触发，colReorder:afterReorder在列重排序完成（鼠标松开）时触发，能精准捕捉重排序的起止时机。
• 拖动过程中colReorder.order()始终包含所有列的索引（仅顺序变化），因此通过长度判断的方式无效，必须依赖事件标记状态。

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