突出显示搜索文本 jquery 数据表

Question

我想在搜索时突出显示 jquery 数据 table 中匹配的文本（不是行）。这个问题是重复的，但我尝试了没有成功的答案。我试过了，

 $('.dataTables_filter input').keyup(function () {
        $('#table td').removeHighlight();
        if ($('.dataTables_filter input').val() != "") {
            $('#table td').highlight($('.dataTables_filter input').val());
        }
    });

它工作得很好，但是当 table 重绘时（当输入中的文本发生变化时），突出显示被删除（这是有道理的，但无法修复）。 Tried this too

Answer 1

您可以尝试使用数据表回调或事件函数：

var yourTable = $('#example').dataTable();

    yourTable.on( 'stateLoaded.dt', function (e, settings, data) {
        if ($('.dataTables_filter input').val() != "") {
            $('#table td').highlight($('.dataTables_filter input').val());
        }
} );

http://datatables.net/reference/event/stateLoaded

或

$('#example').dataTable( {
  "stateSave": true,
  "stateLoaded": function (settings, data) {
     if ($('.dataTables_filter input').val() != "") {
        $('#table td').highlight($('.dataTables_filter input').val());
     }
  }
} );

http://datatables.net/reference/option/stateLoaded

我没有使用过这个特定的插件，但是正如您在 api 中看到的，您有可以使用的回调函数。

突出显示搜索文本 jquery 数据表

Highlight search text jquery datatable

datatable

jquery