数据表突出显示第一个分页页面之外的行

Question

当我尝试突出显示第一个分页页面之外的行时，Datatables 插件给了我一些问题。

在下面的 JS 中，您将看到我将类信息添加到所有行的注释掉的代码。当我这样做并且您分页到其他页面时，其他页面上的所有行都会突出显示。您还将在下面看到未注释的代码，其中我将类信息添加到除第一行之外的所有行，但在这种情况下，当我分页到其他页面时，这些行没有突出显示。

有没有人知道为什么会发生这种情况？

JSFiddle：

https://jsfiddle.net/ebRXw/560/

JS：

$(document).ready(function () {

    $('table').dataTable({
        "paging": true,
        "ordering": true,
        "filter": false,
        "length": false,
        "info": false
    });

    var table = $("table").dataTable();
    var rows = table.$("tr");
    var rowsNext = table.$("tr").next();
    var cell = table.$("td:nth-child(2)");
    var cellNext = table.$("tr").next().children("td:nth-child(2)");

    /*rows.addClass("info");*/
    rowsNext.addClass("info");

});

Answer 1

rowsNext.addClass("info") 仅将类添加到当前页面的行中，并且仅在页面加载时运行一次。

如果您想在每次加载不同的页面时都运行它，您可以在表格的draw event 中添加一个事件监听器，如下所示：

$("table").on("draw.dt", function(){
    var rowsNext = $("table").dataTable().$("tr").next();
    rowsNext.addClass("info");
});

每次绘制新页面时都会运行此代码。

演示：https://jsfiddle.net/alan0xd7/ebRXw/567/