多个Ajax在每个循环中同步运行


Multiple Ajax run syncronus in .each loop

我想多次运行AJAX请求以从不同的文件夹获取数据,并且在最后一次时,AJAX将再次触发以对数据进行压缩。每件事都完成了,但最大的问题是一些文件在文件文件运行后运行,所以它们不能包含在zip文件中。请建议怎么做?

$('#View_Rep').click(function() {
    $(this).hide();
    $('#restable').hide();
    document.adminweeklycorrection.action = '';
    $('#centerSec').css('display', 'none');
    $('#processingDiv').css('display', 'block');
    $('#processingDiv').html("<img height='150' src='img/loading-circle.gif'><h4>Processing data</h4>");
    var carr = $('#wkarr').val();
    carr = carr.split(",");
    $.each(carr, function(n) {
        if ($('#weekarray').val()) {
            $.ajax({
                url: "rxml.php",
                method: "POST",
                async: "false",
                data: $("#adminweeklycorrection").serialize()
            }).done(function(msg) {
                if (n == parseFloat(carr.length) - parseFloat(1)) {
                    $('#processingDiv').html("<img height='150' src='img/loading-circle.gif'><h4>Preparing reports</h4>");
                    $.ajax({
                        url: "cmbrxml.php",
                        method: "POST",
                        async: "false",
                        data: $("#adminweeklycorrection").serialize()
                    }).done(function(msg) {
                        $('#processingDiv').html("<h3>Report generated successfully</h3><h4><a href='" + msg + "'>Download Report</a></h4><h5><a href='adminchartcorrection.php'>Back</a></h5>");
                        if ($('#logtype').val() == 'Ship') {
                            $('#processingDiv').append("<form name='send_mail' id='send_mail' method='post' action='adminchartcorrection.php'><input type='hidden' name='chartnumber' id='chartnumber' value='" + $('#chartnumber').val() + "'><input type='submit' name='send_mail' value='Send Mail' id='send_mail'></form>");
                        }
                        //redir(msg);
                    });
                }
            });
            var curr = $('#weekarray').val();
            curr = curr.split(",");
            var sftd = curr.shift();
            //$('#weekarray').val('');
            $('#weekarray').val(curr);
        }
    });
});

检查循环索引是否是最后一个并不意味着相关的ajax请求是最后一个执行。相反,创建一个带有请求计数的变量,并在每个请求的完成方法中减少它。

试试这个:

var ajaxRequestsLeft = carr.length;        //added
$.each(carr, function(n) {
    if ($('#weekarray').val()) {
        $.ajax({
            url: "rxml.php",
            method: "POST",
            async: "false",
            data: $("#adminweeklycorrection").serialize()
        }).done(function(msg) {
            ajaxRequestsLeft--;            //added
            if(ajaxRequestsLeft == 0) {    //modified
                $('#processingDiv').html("<img height='150' src='img/loading-circle.gif'><h4>Preparing reports</h4>");
                $.ajax({
                    url: "cmbrxml.php",
                    method: "POST",
                    async: "false",
                    data: $("#adminweeklycorrection").serialize()
                }).done(function(msg) {
                    $('#processingDiv').html("<h3>Report generated successfully</h3><h4><a href='" + msg + "'>Download Report</a></h4><h5><a href='adminchartcorrection.php'>Back</a></h5>");
                    if ($('#logtype').val() == 'Ship') {
                        $('#processingDiv').append("<form name='send_mail' id='send_mail' method='post' action='adminchartcorrection.php'><input type='hidden' name='chartnumber' id='chartnumber' value='" + $('#chartnumber').val() + "'><input type='submit' name='send_mail' value='Send Mail' id='send_mail'></form>");
                    }
                    //redir(msg);
                });
            }
        });
var curr = $('#weekarray').val();
curr = curr.split(",");
var sftd = curr.shift();
        //$('#weekarray').val('');
        $('#weekarray').val(curr);
    }
});

我的建议是使用Async请求(它们将同时触发,而不必等到前一个请求完成)。

使用承诺。(我不熟悉jquery的承诺,所以将给出抽象的例子):

var promises = [];
$.each(arr....
    // as I said I'm not sure if $.ajax returns promise in jquery (I use angular). This is just abstract example
    var promise = $.ajax(.... async: TRUE ....)
    promises.push(promise);
});
// again, this is just abstract example, but promises library that you'll use will have a way to register a callback when array of promises are finished
$q.all(promises).then(function(responses) {
    // now ALL requests are finished and you have ALL responses in "responses array
});