使行选择成为 jQuery DataTables 的内置功能

Question

在此页面上

可以看到以下代码附加了一个单击 tbody 的处理程序以在初始化实际数据表对象之前实现行选择功能：

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

/* Init the table */
oTable = $('#example').dataTable();

由于我的项目中的所有数据表都需要此功能，因此我希望这些代码自动运行在每个数据表上对象初始化。

我在这里找到了一个可能的地方（这是fnInitComplete 事件），可以在其中添加这些代码：

但是，代码应该默认运行，而不是像示例那样将它们传递给选项对象中的 fnInitComplete 事件。

您认为这可以如何做到？

非常感谢大家。

编辑：

最后，我决定定义一个全局表选项对象，并在使用它初始化数据表之前克隆它并在必要时修改它，如下所示：

//default table options defined globally, you can namespace it if you like
var jqDataTablesDefaultOptions:{
    "fnDrawCallback": function (oSettings, json) {
        var nTrs = this.fnGetNodes();
        $(nTrs).click(
        function(){
            $(nTrs).removeClass('row_selected');
            $(this).addClass('row_selected');
        }                        
    );
    },
    "aLengthMenu": [5,10,15,20,100],
    "iDisplayLength":5,
    "oLanguage": {
        "sUrl": "/assets/lib/DataTables-1.8.2/media/language/zh_TW.txt"
    },
    "bJQueryUI": true
    "sPaginationType":"full_numbers"                    
};

在我使用数据表的每个页面上，我将有以下代码：

//copy the default options
var tableOptions=$.extend(true,{},jqDataTablesDefaultOptions);
//modify the options if necessary
tableOptions.iDisplayLength=10;
//init the datatable
$('#example').dataTable(tableOptions);

请随意阅读此页面我使用 fnDrawCallback 而不是 fnInitComplete 的原因。

Answer 1

我会制作自己的插件并使用 jQuery $.extend 函数来扩展您使用所需默认值设置的选项。如果您不想为此创建插件，您可以使用 DataTools 插件。

另一个选择是编辑 DataTable js 文件 - 在代码中搜索“classSettings”。但显然这有一个很大的缺点，如果你想升级到新版本，你必须重新编辑它。

对于这种东西，我宁愿使用 fnRowCallback 因为它有 table tr doom 元素作为参数您可以绑定任何您想要的事件。但如果您想使用任何 jQuery 功能，则必须将其包装到 jQuery。