数据表选择行背景颜色

Question

我是新手,所以忍受我; 我正在使用jQuery datatables插件,我需要选择一行并更改所选行的颜色.我从数据表中遵循了这个例子,但它对我不起作用.

这是我初始化表格的方式:

var oTable = $("#rolesTable").dataTable({
    // "bJQueryUI": true,
    "iDisplayLength": 25,
    "aoColumns": [
        null,
        {"sType": "role"},
        null,
        null
    ],
    "aaSorting": [[1, "desc"], [0, "asc"]]
});

这是click事件和CSS类的代码:

<style>
.row_selected tr {
    background-color: black;
}
</style>

$("#rolesTable tbody tr").click(function (event) {
    $(oTable.fnSettings().aoData).each(function () {
        $(this.nTr).removeClass('row_selected');
    });
    $(event.target.parentNode).addClass('row_selected');
});

对不起,我添加了点击处理程序

Answer 1

这是因为类row_selected被添加到<tr>元素中,因此您的选择器与任何内容都不匹配.

此外,background-color添加到<td>元素(您的自定义颜色'在'默认选择颜色'下).

试试:

.row_selected td {
    background-color: black !important; /* Add !important to make sure override datables base styles */
 }

Answer 2

在最新的 Datatables 版本 1.10.12 中，您必须执行以下操作：

 .even.selected td {
           background-color: rgb(0,170,0); !important; /* Add !important to make sure override datables base styles */
  }

 .odd.selected td {
          background-color: rgb(0,0,230); !important; /* Add !important to make sure override datables base styles */
   }