如何将类添加到 jquery.datatables 列？答案

【问题标题】：how to add class to jquery.datatables columns?如何将类添加到 jquery.datatables 列？
【发布时间】：2012-12-23 06:57:54
【问题描述】：

我为 jquery.datatables 制作了一个大表，这对我来说非常有用。
但我需要为每个 td 元素相对于其列设置一个类名。
例如，我想要一个列（包括 th 和所有 td）有一个 class="volume"。
有这个问题：
我使用此代码来初始化类，但它不工作。

"aoColumnsDefs": [
    { "sClass": "volume", "aTargets": [2] }
]

编辑： 我的表是动态创建和刷新的。它是由一个 js-array 组成的，我不想碰它。只是添加类名
编辑：
我使用此代码来初始化我的表：

$('#dataTable').dataTable({
    "aaData": dataCnt,
    "aoColumnsDefs": [
        { "sClass": "volume", "aTargets": [2] }
    ],
    "aoColumns": columnsHd,
    "bStateSave": true,//saving status in coockie
    "iCookieDuration": 10,//coockie life duration in seconds
    "sScrollX": "100%",
    "sScrollY": (winHei-200),
    "sDom": '<"H"RCfrl>t<p"F"i>',
    "oColVis": {
        "buttonText": "&nbsp;",
        "bRestore": true,
        "sAlign": "left"
    },
    "aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]]
});

希望对你有帮助 *EIDT：*
columnsHd 是一个从我的 json 标头动态创建的数组，现在正好是：

[
{ "sTitle": "macaddr" },
{ "sTitle": "lat" },
{ "sTitle": "ip" },
{ "sTitle": "clientname" },
{ "sTitle": "relay0mask" },
{ "sTitle": "relay0stat" },
{ "sTitle": "relay1stat" },
{ "sTitle": "clientid" },
{ "sTitle": "bldname" },
{ "sTitle": "uptime" },
{ "sTitle": "current" },
{ "sTitle": "temperature" },
{ "sTitle": "softver" },
{ "sTitle": "volume" },
{ "sTitle": "hardver" },
{ "sTitle": "relay1mask" },
{ "sTitle": "pic" },
{ "sTitle": "comment" },
{ "sTitle": "lon" },
{ "sTitle": "rtt" },
{ "sTitle": "bldaddr" },
 ]

【问题讨论】：

您是否尝试过模板或动态生成“表格”？你的目标到底是什么？将类标签添加到 html 列？
你知道它被添加到第三列了吗？
是的，我知道它使用基于零的索引，但我尝试了任何组合，但它没有奏效。我不知道我在哪里做错了
你确定这个类没有被应用到你的td吗？你检查过浏览器开发工具吗？
我的猜测是"aoColumns": columnsHd, overrides the "aoColumnsDefs": [ { "sClass": "volume", "aTargets": [2] } , ], 尝试在代码中替换它们的顺序，或者直接在"aoColumns": columnsHd, 中添加类，就像这样sClass: "volume"

标签： javascript jquery html css datatables

【解决方案1】：

我的猜测是"aoColumns": columnsHd, overrides the "aoColumnsDefs": [ { "sClass": "volume", "aTargets": [2] } , ],

尝试在代码中替换它们的顺序

或者直接在"aoColumns": columnsHd,中添加类像这样"sClass": "volume"

完整代码：

尝试将{ "sTitle": "ip" }, 更改为{ "sTitle": "ip", "sClass": "volume" },

并删除

"aoColumnsDefs": [
    { "sClass": "volume", "aTargets": [2] }
],

请注意，在数据表 1.10 中，您应该使用 aoColumnDefs

【讨论】：

我更改了他们的订单 => 不工作。我更改了"aoColumns": columnsHd, like this sClass: "volume" => 整个表不工作实际上不生成
尝试将{ "sTitle": "ip" }, 更改为{ "sTitle": "ip", "sClass": "volume" }, 并删除"aoColumnsDefs": [ { "sClass": "volume", "aTargets": [2] } , ], 我猜它之前不起作用因为我忘记在" 之前和之后添加sClass
它的 "aoColumnDefs" 没有额外的 s。 legacy.datatables.net/usage/columns

【解决方案2】：

问题的答案是

"aoColumnsDefs": [
    { "sClass": "classname", "aTargets": [whatever target you want to apply] }
]

使用其他选项：(ref datatable)

【讨论】：