如何使DataTables自定义过滤器仅作用于指定表格，不影响页面其他表格

这个问题确实很常见——默认情况下$.fn.dataTable.ext.search是个全局过滤器数组，页面上所有DataTables实例在执行过滤时都会遍历这个数组里的函数，所以很容易不小心影响到其他表格。下面给你两种靠谱的解决方案，按需选择：

方法一：在全局过滤器中判断目标表格 #

这种方法适合你已经习惯使用$.fn.dataTable.ext.search.push()的场景，核心思路是在过滤器函数里通过settings参数识别当前表格是否是你要作用的目标，非目标表格直接返回true（即不对其进行过滤）。

settings参数包含了当前表格的所有配置信息，你可以通过它的sTableId属性（表格的ID，不带#）、nTable属性（表格的DOM元素）来定位目标表格。

示例代码：

// 添加仅作用于ID为myTargetTable的表格的过滤器
$.fn.dataTable.ext.search.push(function(settings, data, dataIndex) {
  // 先判断当前表格是否是目标表格
  if (settings.sTableId !== 'myTargetTable') {
    return true; // 非目标表格，直接放行该行显示
  }

  // 这里写你的自定义过滤逻辑
  const filterValue = $('#customFilter').val().trim();
  const rowColumnValue = data[1]; // 假设要过滤第2列（索引从0开始）
  
  // 过滤逻辑：如果过滤框为空，或者行数据包含过滤值，则显示该行
  return filterValue === '' || rowColumnValue.includes(filterValue);
});

// 当过滤条件变化时，调用draw()更新表格
$('#customFilter').on('input', function() {
  $('#myTargetTable').DataTable().draw();
});

如果你的表格是通过类名识别的，也可以这样判断：

if (!$(settings.nTable).hasClass('target-table')) {
  return true;
}

方法二：绑定到特定表格实例的自定义搜索 #

这种方式更优雅，直接将过滤器绑定到目标表格的实例上，完全不会影响其他表格。核心是使用DataTables实例的search()方法，传入自定义过滤函数。

示例代码：

// 先初始化目标表格并保存实例
const targetTable = $('#myTargetTable').DataTable();

// 定义过滤函数并绑定到表格实例
function applyCustomFilter() {
  const filterValue = $('#customFilter').val().trim();
  targetTable.search(function(data, index, row) {
    // data：当前行的数组形式数据；row：当前行的原始数据对象
    const rowColumnValue = data[1];
    return filterValue === '' || rowColumnValue.includes(filterValue);
  }, true, false).draw();
}

// 监听过滤条件变化，触发过滤
$('#customFilter').on('input', applyCustomFilter);

这里search()方法的参数说明：

• 第一个参数：自定义过滤函数，返回true表示该行显示，false则隐藏
• 第二个参数：true表示开启智能过滤（可设为false关闭）
• 第三个参数：false表示不使用正则匹配（可设为true开启）

注意事项 #

• 如果使用方法一，记得在页面销毁或不需要该过滤器时，调用$.fn.dataTable.ext.search.pop()移除它，避免内存泄漏
• 方法二更适合单一表格的独立过滤需求，代码更模块化，不会污染全局过滤器数组

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