Question

所以我一直在努力让这个工作，但我不再有希望，我会感激一些帮助。我将用几句话总结这个想法，我相信你会理解。

$(".el").each(function(){
    console.log("starting");
    // $.ajax GET request
    // console.log($.ajax response)
    // delay of 3 seconds
    console.log("finished, moving on.");
    // next
});

假设我们有3个元素，结果如下：

starting
finished, moving on.
starting
finished, moving on.
starting
finished, moving on.
XHR finished loading: GET "http://localhost/data.json".
XHR finished loading: GET "http://localhost/data.json".
XHR finished loading: GET "http://localhost/data.json".

我淹死了这些ajax请求，我无法得到任何工作。我希望它能以异步方式工作。

Answer 1

通常的模式是使用异步Ajax，然后进行手动迭代，控制下一次迭代的开始时间：

function runIt() {
    var items = $(".el");
    var cntr = 0;

    function next() {
        if (cntr < items.length) {
            console.log("starting now..",cntr);
            // do something with items.eq(cntr)
            $.ajax({
                method: "GET",
                async: true,
                url: "http://..."
            }).then(function() {
                console.log("finished, moving on.");
                ++cntr;
                setTimeout(next, 3000);
            });
        }
    }
    next();
}

Answer 2

我认为，在我所有的尝试中，我只是复杂的东西而不是它们。我发布我的解决方案以防其他人需要它。

$('.el').each(function(i){
    setTimeout(function(){
        console.log("starting now..",i);
        $.ajax({
            method: "GET",
            async: false,
            url: "http://"
        })
        .done(function( msg ) {
            console.log(msg);
        });

        console.log("ended. moving on to next element");
   },1000*i);
});

每个+ ajax请求+延迟

2 个答案: