2

ループ内で複数のJSON呼び出しを行う必要があるプロジェクトに取り組んでいます。そのループを終了したらすぐに、行ったすべての呼び出しの結果を処理する必要があります。自分の操作順序がうまくいくようにこれらの呼び出しを行う方法を理解するのに苦労しています。結果を処理するための私のコードは、サービスへの呼び出しが完了する前に常に実行されます。デモンストレーション用にjsfiddleを作成し、ここにコードを含めています。

http://jsfiddle.net/VEkrf/3/

    var sourceData = { "fooIndex": "foo",
        "barIndex": "bar"
    }
    var destinationData = {};
    for (var sourceIndex in sourceData) {
        $.getJSON('http://echo.jsontest.com/' + sourceIndex + '/' + sourceData[sourceIndex] + '?callback=?', null, function (result) {
            for (var resultIndex in result) {
                alert("Adding " + resultIndex + " : " + result[resultIndex]);
                destinationData[resultIndex] = result[resultIndex];
            }
        });
    }

    if (Object.keys(destinationData).length == 0) {
        alert("Destination not yet populated");
    }
    else {
        alert("Eureka!  You did it!");
    }
4

2 に答える 2

5

これはjQueryDeferredObjectの仕事のようで、私の相棒$.whenです！

$.getJSONすべての呼び出しをに渡します。すべての呼び出しが完了したら、すべての結果$.whenを含む関数を呼び出します。

これをチェックしてください：

var sourceData = {
    "fooIndex": "foo",
    "barIndex": "bar"
};
var destinationData = {};

// Array of AJAX calls
var AJAX = [];

for (var sourceIndex in sourceData) {
    AJAX.push($.getJSON('http://echo.jsontest.com/' + sourceIndex + '/' + sourceData[sourceIndex] + '?callback=?'));
}

// Apply is needed to pass each element as a parameter
$.when.apply($, AJAX).done(function(){
    // This function will be called when all the AJAX calls are done

    // The arguments of the functin are the responses from each request
    for(var i = 0, len = AJAX.length; i < len; i++){
        var result = arguments[i][0];
        //arguments: [resultObj, 'success', jqXHR]
        for (var resultIndex in result) {
            alert("Adding " + resultIndex + " : " + result[resultIndex]);
            destinationData[resultIndex] = result[resultIndex];
        }
    }

    alert("Eureka!  You did it!");
});

注：これは非同期であるためdestinationData、コールバックがトリガーされるまで使用できません。それを使用するコードをコールバック内に配置し.done()ます。

于 2013-02-06T21:04:44.147 に答える
3

すでにjQueryを使用しているので、キュー関数を調べることをお勧めします。ajax呼び出しをキューに入れてから、成功ハンドラーでデキューまたは次の関数を呼び出すことができます。このように彼らは連続して行きます。キューに追加する最後の項目は、返されたデータを処理する関数です。

var sourceData = {
    "fooIndex": "foo",
    "barIndex": "bar"
};
var destinationData = {};

$(function () {
    console.debug('ready');
    for (var sourceIndex in sourceData) {
        console.debug('for Loop');
        $(document).queue('ajax', function (next) {
            $.getJSON('http://echo.jsontest.com/' + sourceIndex + '/' + sourceData[sourceIndex] + '?callback=?', null, function (result) {
                for (var resultIndex in result) {
                    alert("Adding " + resultIndex + " : " + result[resultIndex]);
                    destinationData[resultIndex] = result[resultIndex];
                    next();
                }
            });
        });
    }

    $(document).queue('ajax', function (next) {
        alert("Eureka!  You did it!");
    });
    $(document).dequeue('ajax');
});

私はこれを「同期」ajaxのために常に行います。

これが私が話していることの例です

于 2013-02-06T20:55:17.393 に答える