Javascript 如何确定何时使用数据创建和加载jQuery datatable

我使用的是最新版本的

jquerydatatables

。是否有一个回调函数可以在数据加载并显示在datatable中之后使用

我在

IE8

中试验了一个数据表。我有两组我正在测试的数据（我一次只使用一组）。我有一个JavaScript数组和一组从Ajax调用中获取的数据。我使用的是

ASP.netmvc3

从Ajax调用获取数据的配置：

$('#banks-datatable').dataTable({
     "bProcessing": true,
     "sAjaxSource": '/Administration/Bank/List',
     "aoColumns": [
          { "sTitle": "Engine" },
          { "sTitle": "Browser" },
          { "sTitle": "Platform" },
          { "sTitle": "Version" },
          { "sTitle": "Grade" }
     ],
     "bAutoWidth": false,
     "bFilter": false,
     "bLengthChange": false,
     "iDisplayLength": 10
});

alert('test');

以这种方式加载my datatable时，将创建datatable（无数据），并显示处理框和警报弹出窗口。此时datatable已存在，但尚未将任何数据加载到datatable中。只有当弹出窗口消失时（当我单击弹出窗口上的Ok按钮时），数据才会加载到datatable中。为什么会这样

从JavaScript数组获取其数据的配置：

var aDataSet = [
     ['Trident', 'Internet Explorer 4.0', 'Win 95+', '4', 'X'],
     ['Trident', 'Internet Explorer 5.0', 'Win 95+', '5', 'C'],
     ['Trident', 'Internet Explorer 5.5', 'Win 95+', '5.5', 'A'],
     ['Trident', 'Internet Explorer 6', 'Win 98+', '6', 'A'],
     ['Trident', 'Internet Explorer 7', 'Win XP SP2+', '7', 'A'],
     ['Trident', 'AOL browser (AOL desktop)', 'Win XP', '6', 'A'],
     ['Gecko', 'Firefox 1.0', 'Win 98+ / OSX.2+', '1.7', 'A']
];

$('#banks-datatable').dataTable({
     "aoColumns": [
          { "sTitle": "Engine" },
          { "sTitle": "Browser" },
          { "sTitle": "Platform" },
          { "sTitle": "Version" },
          { "sTitle": "Grade" }
     ],
     "bAutoWidth": false,
     "bFilter": false,
     "bLengthChange": false,
     "iDisplayLength": 10,
     "aaData": aDataSet
});

alert('test');

创建datatable并加载数据，然后只显示弹出窗口。这与第一个场景不同。为什么会这样

如果我使用第一个场景，是否有一种方法可以确定datatable何时创建并加载了数据

---

通过此检查，我希望它是通用的，这样无论我决定以何种方式加载数据，都可以使用它。

您可以使用该功能。每次绘制表时都会调用它。这将包括在表中加载数据、排序或筛选时。

我一直知道javascript是单线程的。以下是一篇支持这一观点的帖子：

在第一个场景中，您将从服务器获取数据，然后用一个警报框挂起线程。在第二个场景中，您预填充数据。我相信这就是区别

演示如何在成功时调用回调：

 // POST data to server
 $(document).ready(function() {
   $('#example').dataTable( {
     "bProcessing": true,
     "bServerSide": true,
     "sAjaxSource": "xhr.php",
     "fnServerData": function ( sSource, aoData, fnCallback ) {
       $.ajax( {
         "dataType": 'json',
         "type": "POST",
         "url": sSource,
         "data": aoData,
         "success": fnCallback
       } );
     }
   } );
 } );

---

您最好使用

finitcomplete

：

$(document).ready(function () {
    $('#example').dataTable({
        "fnInitComplete": function (oSettings, json) {
            alert('DataTables has finished its initialisation.');
        }
    });
})

---

您还可以使用dataSrc作为“成功”的remplacement，因为它不应过载：

下面是datatables.net的典型示例

var table = $('#example').DataTable( {
    "ajax": {
            "type" : "GET",
            "url" : "ajax.php",
            "dataSrc": function ( json ) {
                //Make your callback here.
                alert("Done!");
                return json.data;
                }       
            },
    "columns": [
            { "data": "name" },
            { "data": "position" },
            { "data": "office" },
            { "data": "extn" },
            { "data": "start_date" },
            { "data": "salary" }

        ]
    } );

---

在jQuery DataTable的新版本中，该方法被称为：

DataTable提供InitComplete选项。你可以用它。 也许这会有帮助

$('#example').DataTable({
  "initComplete": function(){
    alert('Data loaded successfully');
  }
});

---

Link->

您是否尝试过

.ajaxSuccess

？还没有，但是是否有一个更通用的方法，我可以使用它，无论它是从Ajax调用获取数据还是仅仅从普通JavaScript数组获取数据？是的，您是对的，它从数组检索数据，您可以尝试和

done（）

方法。我同意Jason的回答，对我很有效，这对我很有效。它调用此函数，而不管我使用的数据是来自JavaScript数组还是来自Ajax调用。谢谢。不过，如果您只需要“onload”事件，则需要额外的变量。谢谢，这正是我在检索AJAX数据和更新GUI时需要捕获的内容。DataTables 1.10的新版本已经发布，API略有更改。回调列表：存在向后兼容性，但新API已被清理。这取决于你使用什么：）与其在页面上发布一个包含大量内容的链接，你是否有可能准确地解释发生了什么变化以及它被什么取代，因为到目前为止，我不知道你想解释什么，我所知道的是以上的作品，你还没有提供一个替代方案。很抱歉，在回来感谢你Xdg的延误，一些巨魔拿走了我的声誉，我刚刚赚了足够的钱，可以再次发表评论。你建议的改变是快速和无痛的，效果非常好。再次衷心感谢您抽出时间解释您的原始评论，非常感谢。太好了！我试图启动一个函数来填充附在包含特定数据表的选项卡上的标记，并保持零计数，因为代码是在检索所有数据（从服务器端ajax）之前启动的。此调用延迟了该函数调用，直到所有数据都返回。