jQuery 推迟；等待函数的回调

Question

我必须用 AJAX 请求调用 3 个函数，然后才能完成其中一个函数。所有函数都需要相同的数据，所以我只想启动一次 AJAX 请求。我认为我需要一个功能来调用 3 个函数中的 2 个来等待并在最后提供数据。也许问题是我是 jQuery Deferred 的新手，没有找到一些基本的东西？感谢您的帮助！

因为我的脚本太复杂了，所以我创建了这个演示：（我希望它是不言自明的）

<script>
    var requestRunning = false;

    //do some ajax request etc...
    function doSomething() {
        return {
            doIt: function (test, startDelay) {
                var dfd = $.Deferred();

                setTimeout(function () {
                    if (requestRunning == false) {
                        console.log("starting ajax call:", test);

                        requestRunning = true;

                        //Fake ajax call
                        setTimeout(function () {
                            dfd.resolve(test);
                            // Todo: A done; provide data to waiting B and C.
                        }, 500);
                    }
                    else {
                        console.log("ajax call allready running, waiting...", test);
                    }
                }, startDelay);

                return dfd.promise();
            }
        }
    }

    // Fake delay for function calls in really short time
    var master = doSomething();
    var a = master.doIt("a", 10);
    var b = master.doIt("b", 15);
    var c = master.doIt("c", 12);

    // Do some stuff with the received data...
    a.done(function myfunction(result) {
        console.log(result + " done");
    });

    b.done(function myfunction(result) {
        console.log(result + " done");
    });

    c.done(function myfunction(result) {
        console.log(result + " done");
    });
</script>

Answer 1

我不完全确定你想做什么，但如果你想做的是一次启动三个 ajax 调用，然后知道它们何时完成，因为 jQuery ajax 已经调用了 return 一个承诺，您可以像这样使用该承诺和 $.when()：

var p1 = $.ajax(...);
var p2 = $.ajax(...);
var p3 = $.ajax(...);

$.when(p1, p2, p3).then(function(r1, r2, r3) {
    // results of the three ajax calls in r1[0], r2[0] and r3[0]
});

或者，你甚至可以不使用中间变量：

$.when(
    $.ajax(...),
    $.ajax(...),
    $.ajax(...)
).then(function(r1, r2, r3) {
    // results of the three ajax calls in r1[0], r2[0] and r3[0]
});

如果您正在调用自己执行 ajax 调用的函数，那么您可以 return 这些函数的 ajax promise 并使用具有上述结构的函数调用：

function doSomethingAjax() {
    // some code
    return $.ajax(...).then(...);
}

$.when(
    doSomethingAjax1(...),
    doSomethingAjax2(...),
    doSomethingAjax3(...)
).then(function(r1, r2, r3) {
    // results of the three ajax calls in r1[0], r2[0] and r3[0]
});

jQuery 推迟；等待函数的回调

jQuery deferrend; callback for waiting functions

javascript

jquery

deferred