如何修改DataTables搜索逻辑实现复选框控制指定列匹配字符串隐藏行

调整后的实现代码 #

把全等匹配改为includes()字符串包含判断即可，修改后代码如下：

$.fn.dataTable.ext.search.push(
    function (settings, searchData, index, rowData, counter) {
          
      var checked = $('input:checkbox[name="chk_box"]').is(':checked');
            
      // 复选框勾选时，若第2列内容包含'druk'则隐藏对应行
      if (checked && searchData[1].includes('druk')) {
        return false;
      }

      // 其余情况展示行
      return true;
          
    });

补充说明 #

• 如果需要实现忽略大小写的模糊匹配，可以把判断逻辑改为searchData[1].toLowerCase().includes('druk'.toLowerCase())，这样无论目标内容是Druk、DRUK还是druk都会被匹配到
• 如果你需要修改匹配的目标子串，直接替换includes方法的入参即可
• 调整后别忘了手动触发一次DataTables的重绘，让过滤逻辑生效：yourDataTableInstance.draw()，其中yourDataTableInstance替换为你初始化DataTables时接收的实例变量。

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