php - 具有同步消息的循环中的多个 AJAX 请求

Question

使用 jQuery 通过循环添加 10 个客户需要 AJAX 请求。

添加第一个客户时，应显示“1 of 10 added”。添加第二个客户时，应显示“2 of 10 added”。等等。

但是，以下功能仅显示最后一条消息“添加了 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);
            }           
        }
    });
}

Answer 1

使用 .append()

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

Answer 2

根据 Anthony Grist的评论，这个 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);
            }    
        }
    });    
}