循环中的ajax中的Ajax

时间:2016-05-08 10:53:35

标签: javascript jquery ajax

我有代码(结构):

for (var x = 0; x < array1.length; x++){
(function(x) {
    $.ajax({
    url : "http://someurl1.ru/"+array1[x]+"/",
    async: false,
    success : function(someresult1){
        array2.length = 0;
        array3.length = 0;
        var br = someresult1.split('<br>');
        for (var b = 0; b < br.length-1; b++){
            var space = br[b].split(" ");
            array2.push(space[0]);
            array3.push(space[1]);
        }
        for (var v = 0; v < array2.length; v++){
        (function(v) {
            $.ajax({
            url : "http://someurl2.ru/"+array2[v]+"_"+array3[v]+"/",
            async: false,
            success : function(someresult2){
                if(JSON.stringify(someresult2).search(some_array[x]) != -1){
                $.ajax({
                url : "http://someurl3.ru/"+array2[v]+"/"+array3[v]+"/"+some_another_array[x]+"",
                async: false,
                success : function(someresult3){
                    array4.push(someresult3);
                }
                });
                }
            }
            });
            })(v);
        }
    }
    });
})(x);
}

我需要在我的请求中激活异步,因为它冻结了我的页面并减慢了程序的工作。有关程序工作的一些解释:

1. Take first element of array1.
2. Creating link and sending request.
3. Taking result and doing some stuff with it.
4. Creating link and sending request.
5. Taking result and doing some stuff with it.
6. Creating link and sending request.
7. Taking result.
8. AND ONLY NOW we take second element of array1 and doing the same.

我需要循环中的同步/连续ajax请求(带有“等待”结果)。

1 个答案:

答案 0 :(得分:0)

我刚刚重新调整了请求网址和回调类型的方式。如果事情不对,请提醒我。虽然,我没有改变程序的行为和风格。我真的懒得把它做得更好。

而不是循环,我创建了一个函数来消耗每个array1项,例如,与array2相同。当在其中一个数组中完成一个请求时,如果存在则下一个请求开始,否则在array1中什么也不做,而在array2中它只是回调array1来执行下一个数组带消耗函数的项请求。

var len = array1.length; // Memorize array1 length

function consume(i) {
    var xhr = new XMLHttpRequest(); // Request
    xhr.open("GET",  "http://someurl1.ru/" + array1[i] + "/" , true);
    xhr.onreadystatechange = function() {
        if(this.readyState === 4) {
            // Status 200 is success
            if(this.status === 200) {
                // `this` invokes the `xhr` object
                // Your success block is here
                successCallback(i, this.responseText);
                // Consume next array1 items if length isn't ranged
            }else{
                // Error block is here; can be 403, 404, 500+, ... etc.
            }
        }
    }
    xhr.send()
}

consume(0);

function consume2(i, array2, array3, arrayLen, callback) {
    var xhr = new XMLHttpRequest(); // Request
    xhr.open("GET",  "http://someurl2.ru/" + array2[i] + "_" + array3[i] + "/", true);
    xhr.onreadystatechange = function() {
        if(this.readyState === 4) {
            // Status 200 is success
            if(this.status === 200) {
                // Your success block is here
                if(JSON.stringify(xhr.responseText).search(some_array[i]) !== -1){
                    var xhr2 = new XMLHttpRequest(); // Request
                    xhr2.open("GET", "http://someurl3.ru/" + array2[i] + "/" + array3[i] + "/" + some_another_array[i], true);
                    xhr2.onreadystatechange = function() {
                        if(this.readyState === 4) {
                            // Status 200 is success
                            if(this.status === 200) {
                                // Your success block is here
                                array4.push(xhr2.responseText);
                                // Consume next array2 items
                                if(i < len)
                                    consume2(++ i)
                                ;else
                                    callback()
                            }else{
                                // Error block is here; can be 403, 404, 500+, ... etc.
                            }
                        }
                    };
                    xhr2.send()
                }
            }else{
                // Error block is here; can be 403, 404, 500+, ... etc.
            }
        }
    }
    xhr.send()
}

function successCallback(f, data) {
    array2.length = 0;
    array3.length = 0;
    var br = someresult1.split('<br>');
    for (var b = 0; b < br.length; b++){
        var space = br[b].split(" ");
        array2.push(space[0]);
        array3.push(space[1]);
    }
    consume2(0, array2, array3, array2.length, function() {
        if(f < len)
            consume(++ f)
    })
}

我还要更新此代码,但我不明白你肯定想用它做什么。