66

を使用しjQuery.whenて2つのajaxリクエストを起動し、2つのリクエストが完了した後に関数を呼び出そうとしています。これが私のコードです:

var count = 0;
var dfr;

var showData = function(data) {
    dfr.resolve();
    alert(count);
   // Do something with my data data received
};

var method1 = function() {
    dfr = $.Deferred();

    return $.ajax('localhost/MyDataService/DataMethod_ReturnsData', {
        dataType: "jsonp",
        jsonp: "$callback",
        success: showData
    });
};

var method2 = function() {
    return $.ajax('localhost/MyDataService/DataMethod_ReturnsCount', {
        dataType: "jsonp",
        jsonp: "$callback",
        success: function(data) {
            count = data.d.__count;
        }
    });
};

$.when(method1(), method2())
    .then(showData());

ただし、これは期待どおりに機能していません。Ajax呼び出しmethod1は、で使用されるデータを返しshowData()、Ajax呼び出しは、method2var countに割り当てられ、後でで使用されるcountを返しますshowData()

しかし、上記のコードを実行method1すると、呼び出されてから、データmethod2をとしてshowData残します。どうすればこれを達成できますか?私が知る限り、返される両方の関数が実行された場合にのみ進行します。両方のajax呼び出しを並行して呼び出し、両方の呼び出しの結果に基づいて後の結果を表示する必要があります。showData'undefined'$.when$.promise

4

3 に答える 3

74
function showData(data1, data2) {
    alert(data1[0].max_id);
    alert(data2[0].max_id);
}

function method1() {
    return $.ajax("http://search.twitter.com/search.json", {
        data: {
            q: 'ashishnjain'
        },
        dataType: 'jsonp'
    });
}

function method2() {
    return $.ajax("http://search.twitter.com/search.json", {
        data: {
            q: 'ashishnjain'
        },
        dataType: 'jsonp'
    });
}

$.when(method1(), method2()).then(showData);​

これが動作するjsFiddleです

于 2011-03-13T17:26:14.717 に答える
34

問題は、に渡すshowData()のでthen()はなく、に渡すことですshowData。関数への参照を.then():に渡す必要があります。

$.when(method1(), method2())
    .then(showData);

また

$.when(method1(), method2())
    .then(function () {
        showData();
    });

編集

実用的なデモをまとめました。問題の一部(少なくとも投稿したコードフラグメントでは)は、という名前のコールバック関数がなかったこと$callbackです。問題の一部は$、コールバック名にありました'$callback'

したがって、jsonp: '$callback'ajaxオプションを削除して、jQueryがデフォルトでという名前のコールバック関数になり、その名前callbackで関数定義すると、すべてが機能します。

于 2011-03-12T06:20:08.807 に答える
-4

私はあなたのコードを少し修正し、理解しやすくしました...私はそれをテストしていませんそれを試してみてください

var count = 0;
function countResponse(data) {
    count++;
    if(count==2)
    {
        // Do something after getting responce from both ajax request
    }
};

var method1 = function() {
    return $.ajax('localhost/MyDataService/DataMethod_ReturnsData', {
        dataType: "jsonp",
        jsonp: "$callback",
        success: function(data) {
            countResponse(data)
        }
    });
};

var method2 = function() {
    return $.ajax('localhost/MyDataService/DataMethod_ReturnsCount', {
        dataType: "jsonp",
        jsonp: "$callback",
        success: function(data) {
            countResponse(data)
        }
    });
};
于 2011-03-12T06:12:09.023 に答える