Question

我正在尝试完成以下操作： 1）获取数据来源和＆＃34;用它做某事＆＃34;。 2）获取其他来源的数据，然后用它做某事＆＃34;。 3）数据提取应该优选地异步运行（同时，即第二个不应该等待第一个完成）。 4）当两者都完成时，一些业务逻辑会运行 - 但只有在它们完成时才会运行。

我已经创建了一个小型的JSFiddle来展示我认为这可行的方式 - 但不幸的是它没有： a）数据提取调用按顺序执行。 b）上面步骤4的业务逻辑在数据提取开始之前执行...

在这里小提琴：https://jsfiddle.net/LeifFrederiksen/emttmhm7/

$.when(
    getOneThing(),
    getAnotherThing()
).done(
    function() {
        console.log("Got it all");
        $("#Output").append("<BR>Got it all");
    }
);

function getOneThing() {
   commonFunctionToGetStuff("oneKindOfThings",renderOneKindOfThings);
}

function getAnotherThing() {
   commonFunctionToGetStuff("anotherKindOfThings",renderAnotherKindOfThings);
}

function commonFunctionToGetStuff (listTitle,successFunction) {
    var url = "https://httpbin.org/get";

    $.ajax({
        url: url,
        type: "GET",
        headers: { "accept": "application/json;odata=verbose" }
    }).success(function (data) {
        console.log("Calling renderfunction for " + listTitle);
        $("#Output").append("<BR>Calling renderfunction for " + listTitle);
        successFunction(data);
        console.log("Back from renderfunction for " + listTitle);
        $("#Output").append("<BR>Back from renderfunction for " + listTitle);
    });
}

function renderOneKindOfThings(data) {
    // Do something with the data...
    console.log("Doing oneKindOfThings.");
    $("#Output").append("<BR>Doing oneKindOfThings.");
}

function renderAnotherKindOfThings(data) {
    // Do something with the data...
    console.log("Doing anotherKindOfThings.");
    $("#Output").append("<BR>Doing anotherKindOfThings.");
}

非常感谢任何帮助清理结构的方式。

我需要维护一个结构，其中执行实际Ajax调用的函数是通用的，并且可以通过简单的包装器函数调用，其中参数控制要使用的数据源 - 就像在示例中一样： - ）

此致雷夫

Answer 1

您需要从commonFunctionToGetStuff - 方法和调用它的方法返回承诺。否则，您将undefined传入when - 函数，该函数将立即执行完成回调。此外，您还有一些错误的回拨名称（done或then，而不是success。）

function getOneThing() {
   return commonFunctionToGetStuff("oneKindOfThings",renderOneKindOfThings);
}

function getAnotherThing() {
   return commonFunctionToGetStuff("anotherKindOfThings",renderAnotherKindOfThings);
}

function commonFunctionToGetStuff (listTitle,successFunction) {
    var url = "https://httpbin.org/get";

    return $.ajax({...})
            .then(function (data) { ...});
}

JQuery / Ajax以及何时/完成/承诺混淆

1 个答案: