jQuery 数据表 - 突出显示选定的行

Datatables - highlight selected row

提问by user2444474

How to highlight the selected row in datatables. I have updated the html with jquery code datatables in jsfiddle. Please help me to write css to highlight the selected row in different color.

如何突出显示数据表中的选定行。我已经用 jsfiddle 中的 jquery 代码数据表更新了 html。请帮助我编写 css 以突出显示不同颜色的选定行。

var oTable = $("#products1").dataTable({
       "aaData": newarray,
       "bProcessing": true,
       "bDeferRender": true,
       "bFilter": false,
       "bJQueryUI": true,
       "bRetrieve": true,
       "bPaginate": false,
       "bSort": true,
       "aaSorting": [[4, "desc"]],
       "iDisplayLength": 25,
       "aoColumns": [{"sWidth": "100%","sClass": "center","bSortable": false},
             {
            "sWidth": "150%","sClass": "center","bSortable": false},
             {
            "sWidth": "150%","sClass": "center","bSortable": false},
             {
            "sWidth": "150%","sClass": "center","bSortable": false}


            ],
        "aoColumnDefs": [{ "fnRender": function (o, val) {
            return o.aData[0];
        },
            "sClass": "col1","aTargets": [0]
    }, {
        "fnRender": function (o, val) {

            return o.aData[1];
        },
            "sClass": "col2","aTargets": [1]
    }, {
    "fnRender": function (o, val) {

            return o.aData[2];
        },
            "sClass": "Number","aTargets": [2]
    },{
    "fnRender": function (o, val) {

            return o.aData[3];
        },
            "sClass": "Name","aTargets": [3]
    }]

});

here find jsfiddle

在这里找到jsfiddle

回答by yeyene

Check the demo here

在此处查看演示

Add this after the table call.

在 table 调用之后添加它。

    $("#products tbody tr").on('click',function(event) {
        $("#products tbody tr").removeClass('row_selected');        
        $(this).addClass('row_selected');
    });