数据表：如何添加自定义服务器端样式？答案

【问题标题】：Datatables: How to add custom server-side styling?数据表：如何添加自定义服务器端样式？
【发布时间】：2014-04-13 08:33:36
【问题描述】：

我在一个简单的 HTML 表上使用数据表。然而，这个表是由我的 PHP 脚本在服务器端构建的。

所以我只是构建了一个包含“thead”和“tbody”的“table”元素，并在页面加载后将数据表应用于 table 元素。

以前（在使用数据表之前），我可以通过为行、单元格等设置特定的类来自定义表格的样式。

但似乎在指定自定义类时，例如：

<tr class='MyCustomClass'>

在应用数据表时被覆盖。

数据表中是否有包含我的自定义类的设置？阅读文档，数据表中有很多样式选项，但据我所知，这些都是必须在客户端执行的 javascript 函数，所以如果这些是我唯一设置数据表样式的选项，那么很难根据给定行、单元格等的内容实现服务器端样式...

编辑

例子：

OK：表（没有数据表加载器），第二行标记为红色：http://jsfiddle.net/HEDvf/1164/
不正常：加载了数据表的同一个表，第二行周围没有红色边框：http://jsfiddle.net/HEDvf/1163/

请注意，在这两个示例中，html 源表在第二个 'tr' 元素中都有“style='border-color: red;border-style:solid”，但是当在该表上加载数据表时，红色边框不是可见

【问题讨论】：

标签： javascript php css datatable

【解决方案1】：

那么你是动态加载表格 HTML 吗？如果要“回显”结果，则应将内联 css 属性与 echo 语句一起放置。

echo "<tr style='border:1px solid red>'" . $row['myRow'] . "</tr>";

【讨论】：

很抱歉，但我不明白为什么这很重要。在 jsfiddle 示例中，我编写了静态 html，但它仍然无法正常工作，AFAIK 如果它首先不适用于静态代码，那么输出 html 代码并不重要

【解决方案2】：

在您的示例中显示“不好”，看起来样式保持不变。它不在第二行，但如果您转到第 5 个“页面”，它在Trident Internet Explorer | 5.0 | Win 95+ | 5 | C 行附近。

DataTables 按将 Trident 推到第 5 页的“渲染引擎”列对结果进行排序。

覆盖与 DataTables 冲突的样式可能并不容易，但看起来可以应用类和内联样式。请参阅updated example here，我在其中覆盖了字体样式和背景颜色。

您现在可能已经找到了一些方法来满足您的需求，但 DataTables 并不一定反对让您添加自己的样式。

【讨论】：

【解决方案3】：

我已经这样做了，这是一个例子，如果基于他，我说当第3列等于第4列时将在<tr>中添加一个名为'red'的类

例子：

"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {                
    if ( aData[3] != aData[4]){
        jQuery(nRow).addClass('red');
    }               
},

http://www.datatables.net/forums/discussion/2025/fnrowcallback-and-fnupdate

【讨论】：