Jquery 为什么DataTables呈现函数被调用了3次？

我使用的是DataTables 1.10.9，带有客户端处理

我使用“ajax”选项来检索DataTable的数据

我在“render”函数中添加了一个小的console.log（renderCount）

表中有4921行

但是，控制台显示渲染函数总共被调用了14772次

（14772=行数*3+11）

我相信这会减慢渲染过程

更重要的是，我设置了“deferRender”选项，因此我认为render函数应该只调用10次，这是默认的页面大小

发生什么事了

除了服务器端处理之外-如何提高此表的初始渲染性能

以下是一行数据的示例：

{ 
    Id: 1, 
    Type: "Purchases", 
    LifecycleStatus: "Manual", 
    ReceivedAtLocal: "04/02/2016 20:45:16", 
    ModifiedAtLocal: "04/02/2016 21:45:16", 
    Operator: "a-mjohn", 
    PartNumber: "IXAWGCAUNVJHONP" 
}

以下是表格定义代码：

    var renderCount = 0;
    transactionTable = $("#tblTransactions").DataTable({
        "searchDelay" : 500,
        "bDestroy": true,
        "ajax": window.getTransactionDataUrl,
        "processing": false,
        "deferRender" : true,
        "columns": [
            {
                'render': function (data, type, full, meta){                        
                    // Other code omitted for brevity
                    renderCount++;
                    console.log(renderCount);
                    return "";
                },
                "bSortable": false
            },
            {
            'render': function (data, type, full, meta) {
                return '<input type="checkbox">';
            },
            "bSortable": false
        },
        { "data": "Id" },
        { "data": "Type" },
        { "data": "LifecycleStatus" },
        { "data": "Operator" },
        { "data": "PartNumber" },
        { "data": "ReceivedAtLocal" },
        { "data": "ModifiedAtLocal" },
        { "defaultContent": "<button class='btn btn-primary btn-xs' data-toggle='modal' data-target='#detailsModal'>Details</button>", "bSortable": false },
        { "defaultContent": "<button class='btn btn-primary btn-xs' data-toggle='modal' data-target='#auditModal'>Audit</button>", "bSortable": false },
        { "defaultContent": "<button class='btn btn-primary btn-xs' data-toggle='modal' data-target='#commentModal'>Comments</button>", "bSortable": false }
    ],
    "rowId": "Id",
    'order': [[7, "asc"]],
    'rowCallback': function (row, data, dataIndex) {
        // Get row ID
        var rowId = data["Id"];

        if ($.inArray(rowId, window.transIndexPage.rows_selected) !== -1) {
            $(row).find('input[type="checkbox"]').prop("checked", true);
            $(row).addClass("selected");
        }
    }
});

var renderCount=0；
transactionTable=$（“#TBLTTransactions”）.DataTable({
“搜索延迟”：500，
是的，
“ajax”：window.getTransactionDataUrl，
“处理”：假，
“延迟渲染”：正确，
“栏目”：[
{
“呈现”：函数（数据、类型、完整、元）{
//为简洁起见，省略了其他代码
renderCount++；
控制台日志（renderCount）；
返回“”；
},
“可移植”：false
},
{
“呈现”：函数（数据、类型、完整、元）{
返回“”；
},
“可移植”：false
},
{“数据”：“Id”}，
{“数据”：“类型”}，
{“数据”：“生命周期状态”}，
{“数据”：“运算符”}，
{“数据”：“零件号”}，
{“数据”：“ReceivedAtLocal”}，
{“数据”：“ModifiedAtLocal”}，
{“defaultContent”：“Details”，“bSortable”：false}，
{“defaultContent”：“Audit”，“bSortable”：false}，
{“defaultContent”：“Comments”，“bSortable”：false}
],
“rowId”：“Id”，
“订单”：[7，“asc”]，
“rowCallback”：函数（行、数据、数据索引）{
//获取行ID
var rowId=数据[“Id”]；
if（$.inArray（选定了rowId、window.transIndexPage.rows）！=-1）{
$（行）.find（'input[type=“checkbox”]”）.prop（“checked”，true）；
$（行）.addClass（“选定”）；
}
}
});

由option定义的函数实际上被调用了多次，因为jQuery DataTables将返回值用于多种用途

从：

请注意，此函数可能会被多次调用，因为DataTables将为其需要的不同数据类型（排序、筛选和显示）调用它

您可以根据提供的

类型

参数为不同的操作返回不同的值。如果希望显示一个值，并使用另一个值进行排序，则可能需要此选项。例如，这对包含日期的字段很有帮助

---

您可以通过在客户端处理模式下使用或切换到来提高性能。请注意，在中，您需要自己在服务器上实现排序、分页和筛选。

感谢您对渲染功能的解释。手册中引用的“数据类型”的确切含义是什么？我猜这不是‘int’对‘string’，而是更像‘data usage’=>中的‘使用列值的表示进行排序’和‘使用其他值进行显示’？在我的问题中-我声明我已经在使用‘deferRender’选项。除了服务器端处理之外，还有其他提高性能的建议吗？@JTech，jQuery DataTables请求用于排序、搜索和显示的不同值。您可以选择使用三个不同的值，这解释了为什么多次调用

render

。