DataTable的drawCallback是如何工作的？

Question

我试图使用 .CSS 根据其值应用于CSS每个单元格，而不是全部。这是我的问题的JsFiddle。有没有人遇到过这个问题并找到解决方案或对此有任何想法。请提出建议！DataTabledrawCallback()

  "drawCallback": function( settings ) {
        var api = this.api();
        var visibleRows=api.rows( {page:'current'} ).data();
        if(visibleRows.length >= 1){
        for(var j=1;j<visibleRows[visibleRows.length -1].length;j++){
          $("td:eq("+j+")", settings.nTBody.childNodes[visibleRows.length -1]).addClass(visibleRows[visibleRows.length -1][j]);
        }
        }
    },

Answer 1

就像 @charlietfl 所说，您真的不想使用drawCallback来格式化行，并且您可能最好使用createdRow(rowCallback) 来进行此格式化。

drawCallback在每个绘制事件上调用，这意味着它实际上用于更新刚刚添加的行或处理刚刚更新的数据。

createdRow另一方面，被设计为在创建行时调用，这似乎是您真正想要的。在本文档（示例）中，您可以看到作者展示了如何使用此选项将类添加到某些行，这似乎最接近您想要做的事情。

据我所知，你想让每个单元格都有一个与单元格中的文本相同的 CSS 类（如果我错了，请纠正我）。最简单的方法如下createdRow：

"createdRow": function ( row, data, index ) {
    for(var i = 0;i<data.length;i++){
        $('td', row).eq(i).addClass(data[i]);
        //The above line assumes that you want to add a CSS class named "red" to a 
        //field that has the text "red" in it, if not, you can change the logic
    }
}

只需将其包含在调用的初始化选项中即可.DataTables()。

我必须对哪些类添加到哪些列的确切逻辑做出一些假设，但如果它们是正确的，那么这应该向每个字段添加一个类，该类的名称与该字段中的文本相同。