帶有同步消息的循環中的多個AJAX請求

使用jQuery通過循環添加10個客戶需要AJAX請求。帶有同步消息的循環中的多個AJAX請求

添加第1個客戶時，應顯示「添加了10個」。添加第2個客戶時，應顯示「添加了10箇中的2個」。等。

但是，以下功能僅顯示最後一條消息「添加了10個10」，並且瀏覽器在添加這10個客戶時保持忙碌狀態。

function addCustomer(total) 
{ 
    var addedIndex = parseInt($("#added-index").val()); 

    $.ajaxSetup({cache : false}); 
    $.ajax({ 
     type: "POST", 
     url: "add_customer.php", 
     data: "added_no=" + document.getElementById("added-index").value, 
     global: false, 
     async: false, 
     cache: false, 
     success: function(html){ 
      $("#added-index").val(addedIndex + 1); 
      addedIndex = parseInt($("#added-index").val()); 

      if (addedIndex < total) { 
       addCustomer(total); 
      } 
      else { 
       $("#cc-msg").html(html); 
      }   
     } 
    }); 
}

來源

2013-02-27 Agilox

閱讀關閉關閉。我認爲這是JS最重要的部分，大部分問題都是因爲開發人員不完全理解它。 – 2013-02-27 15:24:36

如果您不希望瀏覽器被鎖定，請移除'async：false'。 AJAX的重點在於它應該是異步的。 – 2013-02-27 15:40:03

謝謝。它解決了。 – Agilox 2013-02-27 15:43:49

根據安東尼格里斯特評論，這AJAX請求不應該有async: false參數。所以，答案是：

function addCustomer(total) 
{ 
    var addedIndex = parseInt($("#added-index").val()); 

    $.ajaxSetup({cache : false}); 
    $.ajax({ 
     type: "POST", 
     url: "add_cc.php", 
     data: "added_no=" + document.getElementById("added-index").value, 
     global: false, 
     cache: false, 
     success: function(html){ 
      $("#added-index").val(addedIndex + 1); 
      addedIndex = parseInt($("#added-index").val()); 

      if (addedIndex < total) { 
       addCustomer(total); 
      } 
      else { 
       $("#cc-msg").html(html); 
      }  
     } 
    });  
}

來源

2013-03-01 11:57:36 Agilox

使用.append（）

$("#cc-msg").append(html + '<img src="img/ajax_loader.gif" width="35" hspace="150" height="35" vspace="7" align="middle" >');

來源

2013-02-27 15:43:02

根據Anthony Grist的評論，它已在解除async：false後解決。 – Agilox 2013-02-27 15:51:45

嘗試提供有關您的答案的詳細信息，而不僅僅是解決方案。海報需要了解他在做什麼。 – CosminO 2013-02-27 16:01:39

帶有同步消息的循環中的多個AJAX請求

回答

相關問題