12

jquery .each() と .ajax() 関数を一緒に使用すると問題が発生します。私は .each() を使用して 5 つの要素をループし、それぞれに対して .ajax() 呼び出しを実行しています。私の問題は、各 ajax リクエストから応答が受信されたときにのみループを続行したいということです。現在、5 つの要素すべてがループされており、5 つの ajax リクエストが行われ、5 つの応答が返されています。

彼女は簡単な例です：

$(".element").each(function() {
    var id= $(this).find(('txtId').val();
    $.ajax({
       type: "POST",
       url: "/Handlers/Handler.ashx",
       data: "ID=" + id,
       success: function(xml){

         // I would like the each() loop to pause until this is hit, 
         // and some additional logic can be performed. 

       }
     });

});

乾杯。

4

5 に答える 5

11

このオプションを使用してasync、各リクエストを同期させることができます（=各リクエストが終了するまでスクリプトの実行を停止します）。

async デフォルトでは、すべての要求は非同期で送信されます（つまり、これはデフォルトでtrueに設定されています）。同期リクエストが必要な場合は、このオプションをfalseに設定してください。クロスドメインリクエストとdataType：「jsonp」リクエストは同期操作をサポートしていません。同期リクエストはブラウザを一時的にロックし、リクエストがアクティブな間はアクションを無効にする可能性があることに注意してください。

ただし、ドキュメントですでに述べているように、リクエストがハングしたりタイムアウトしたりするとブラウザがフリーズする可能性があるため、これはお勧めできません。

可能であれば、従来のコールバック関数で機能するようにコードのアーキテクチャを変更することをお勧めします。

于 2010-07-13T13:24:42.790 に答える
3

ペッカが正解。以下のようにスクリプトを編集するだけです。

$(".element").each(function() {
    var id= $(this).find(('txtId').val();
    $.ajax({
       type: "POST",
       async: false,
       url: "/Handlers/Handler.ashx",
       data: "ID=" + id,
       success: function(xml){

       }
     });

});
于 2010-07-13T13:34:47.297 に答える
0

jquery defered および promise 関数を使用して、非同期呼び出しが成功したかどうかを確認できます。http://joseoncode.com/2011/09/26/a-walkthrough-jquery-deferred-and-promise/

于 2012-10-08T13:57:56.867 に答える
0

方法があると言ってうれしいです...しかし、それは少し厄介です。

リクエストが何かを返す必要があると確信している場合は、「tryIteration」部分を削除できます。

$(document).ready(function() {

        loop(".buttonsPromotion", 0);

});

function loop(elements, tryIteration) {
//HOW MANY TRIES UNTIL WE STOP CHECKING
if(tryIteration<7){

    $(elements).each(function() {            
        var actuel = $(this);
        $.ajax({
           url: "write your link here",
           data: {},
           dataType: 'json',
           async: true,
           success: function(data){
               //HERE WE KNOW THE AJAX REQUEST WENT OK
               actuel.addClass('AjaxOK');    
           },
           error:function(thrownError){
                console.log(thrownError);
                //WE MAKE ANOTHER EACH ON ALL ELEMENT THAT WENT BAD
                var elemToRetry = actuel.not('AjaxOK');
                loop(elemToRetry, ++tryIteration);
            }
         });

    });
}
}
于 2011-07-05T11:06:21.440 に答える