ajax（代碼）塊之後的代碼需要延遲

Question

我有一個很長的問題，隨着我的完整代碼，但現在它是較短的一個。

function showRecord(tbl) { 
    myDataTable.fnDestroy(); 
    $.ajax(
    { 
     data: "tableName=" + tbl, 
     url: "showTable.php", 
     dataType: "html", 
     success: function (data) { $("#example").html(data); } 
    }); 
    alert('I get desired output as long as I do not comment/remove this alert'); 
    myDataTable = $('#example').dataTable(); 
} 

但，如果我只是發表意見alert我不從數據庫中獲得

數據如果我不使用$('#example').dataTable();（用於分頁jQuery插件從datatables.net）然後代碼工作正常，沒有警報。

function showRecord(tbl) { 
    //myDataTable.fnDestroy(); 
    $.ajax(
    { 
     data: "tableName=" + tbl, 
     url: "showTable.php", 
     dataType: "html", 
     success: function (data) { $("#example").html(data); } 
    }); 
    //alert('I get desired output as long as I do not comment/remove this alert'); 
    //myDataTable = $('#example').dataTable(); 
} 

我需要知道爲什麼alert在第一個代碼示例中是必需的。如果它造成延遲，爲什麼延遲是必要的，以及如何在不使用alert

Answer 1

Ajax調用是異步的。在第一個代碼塊（如果沒有alert）Ajax調用得到執行，然後之後立即（服務器響應之前）這行執行：

myDataTable = $('#example').dataTable(); 

而且由於服務器沒有返回結果尚未$('#example')是空的。你可以這樣說：

function showRecord(tbl) { 
    myDataTable.fnDestroy(); 
    $.ajax(
    { 
     data: "tableName=" + tbl, 
     url: "showTable.php", 
     dataType: "html", 
     success: function (data) { 
      $("#example").html(data); 
      myDataTable = $('#example').dataTable(); 
     } 
    }); 
} 

Answer 2

試試這個。

function showRecord(tbl) { 

     //myDataTable.fnDestroy(); 
     $.ajax(
     { 
      data: "tableName=" + tbl, 
      url: "showTable.php", 
      dataType: "html", 
      success: function (data) { 
       $("#example").html(data); 
       myDataTable = $('#example').dataTable(); } 
     }); 
     //alert('I get desired output as long as I do not comment/remove this alert'); 
     // 
    }