遅延コール私は、次のJSのメソッドを持ってい

Question

を呼び出します。

var foo = function() { 
     var dfd = $.Deferred(); 
     console.log('foo'); 
     dfd.resolve(); 
     return dfd.promise(); 
    }; 
    var ajaxCall1 = function() { 
     var dfd = $.Deferred(); 
     $.ajax({ 
      type: 'POST', 
      contentType: 'application/json; charset=utf-8', 
      dataType: 'json', 
      url: 'xxxxxxx', 
      data: { }, 
      success: function(response) { 
       dfd.resolve(); 

      } 
     }); 
     return dfd.promise(); 
    }; 
    var ajaxCall2 = function() { 
     var dfd = $.Deferred(); 
     $.ajax({ 
      type: 'POST', 
      contentType: 'application/json; charset=utf-8', 
      dataType: 'json', 
      url: 'xxxxxxx', 
      data: {}, 
      success: function (response) { 
       dfd.resolve(); 

      } 
     }); 
     return dfd.promise(); 
    }; 
    var ajaxCall3 = function() { 
     var dfd = $.Deferred(); 
     $.ajax({ 
      type: 'POST', 
      contentType: 'application/json; charset=utf-8', 
      dataType: 'json', 
      url: 'xxxxxxx', 
      data: {}, 
      success: function (response) { 
       dfd.resolve(); 

      } 
     }); 
     return dfd.promise(); 
    }; 

と、私はこのコードを経由して、それらを呼び出しています：

foo().done(function() { 
     return ajaxCall1(); 
    }).done(function() { 
     return ajaxCall2(); 
    }).done(function() { 
     return ajaxCall3(); 
    }); 

問題がajaxCall2はの成功の前に呼び出されていることですajaxcall1が発生しました。これを修正する手助けはできますか？私は前のものの成功が起こったときにajaxを1つずつ呼び出す必要があります。

Answer 1

は、すべての$ .when

var deferredObject = $.ajax({}); 
$.when(deferredObject) 
.then(function(){ 
    var deferredobject2 = $.ajax({}); 
    $.when(deferredobject2) 
     .then(function(){ alert('after 2nd ajax call');}); 

    }); 

Answer 2

簡略化します。

function foo() { 
    var dfd = $.Deferred(); 
    console.log('foo'); 
    dfd.resolve(); 
    return dfd.promise(); 
} 

function ajaxCall1() { 
    return $.ajax({ 
     type: 'POST', 
     dataType: 'json', 
     url: 'xxxxxxx', 
     data: { }, 
     success: function(response) { 
      console.log('ajaxCall1 success'); 
     } 
    }); 
    return dfd.promise(); 
} 

// and so on for ajaxCall2 and ajaxCall3 

エンハンス。

foo().done(function() { 
    ajaxCall1().done(function() { 
     ajaxCall2().done(function() { 
      ajaxCall3(); 
     }); 
    }); 
}); 

http://jsfiddle.net/mattball/LxjDS/

---

さらにリーディング：

• How to chain ajax calls using jquery
• jQuery Deferred not calling the resolve/done callbacks in order
• jQuery deferred - do I need pipes or chains to achieve this pattern?

Answer 3

ブラウザがハングアップする原因となる。このようなAJAX要求にブラウザをスラミング、Frame.js

var responses = []; 
for(var i=0; i<1000; i++){ 
    Frame(function(callback){ 
     $.ajax('myserver.api', { 
      data:i, 
      type:'post', 
      complete:function(response) { 
       responses.push(response); 
       callback(); 
      } 
     }); 
    }); 
} 
Frame.start(); 

通常でコールバックを簡素化以外の答えと同じ、および応答変数が順序で返される彼らそれらが送られた元の順序ではなく受信されます。ここでは、フレームをミックスに追加すると、すべてのものが並べ替えられます。

それともあなただけのコールバックを平らにそれを使用することができます：

Frame(function(next){ 
    foo().done(next); 
}); 
Frame(function(next){ 
    ajaxCall1().done(next); 
}); 
Frame(function(next){ 
    ajaxCall2().done(next); 
}); 
Frame(function(next){ 
    ajaxCall3().done(next); 
}); 
Frame(function(next){ 
    //do more stuff 
    next(); 
}); 
Frame.start(); 

Answer 4

まずを使用して、あなたは$アヤックスの呼び出しの結果を返すことができます彼らはすでに（中間繰延の必要がない）約束しているので、直接：

var ajaxCall1 = function() { 
    return $.ajax({ 
     type: 'POST', 
     contentType: 'application/json; charset=utf-8', 
     dataType: 'json', 
     url: 'xxxxxxx', 
     data: { } 
    }); 
}; 
var ajaxCall2 = function() { 
    return $.ajax({ 
     type: 'POST', 
     contentType: 'application/json; charset=utf-8', 
     dataType: 'json', 
     url: 'xxxxxxx', 
     data: {} 
    }); 
}; 
var ajaxCall3 = function() { 
    return $.ajax({ 
     type: 'POST', 
     contentType: 'application/json; charset=utf-8', 
     dataType: 'json', 
     url: 'xxxxxxx', 
     data: {} 
    }); 
}; 

第二に、何をしたい使用することはですは、効果的に呼び出しチェーンに：私は、SharePointのWebサービスと大きく働い同様の問題を持っていた

foo().pipe(function() { 
    return ajaxCall1(); 
}).pipe(function() { 
    return ajaxCall2(); 
}).pipe(function() { 
    return ajaxCall3(); 
}).done(function() { 
    // call1, call2 and call3 done in sequence 
}).fail(function() { 
    // one of the ajax requests failed 
}); 

Answer 5

を - あなたは、多くの場合、あなたが仕事を続けることができるしている前に、複数のソースからデータを取得する必要があります。

私はこの種の機能をAJAX抽象化ライブラリに組み込みました。完了時に一連のハンドラを起動するリクエストを簡単に定義できます。ただし、各リクエストは複数のhttp呼び出しで定義できます。ここではコンポーネントがあります：多くのとは違っていること

// The handler function 
function AddUp(Nums) { alert(Nums[1] + Nums[2] + Nums[3]) }; 

    // Create the pool 
myPool = DP_AJAX.createPool(); 

    // Create the request 
myRequest = DP_AJAX.createRequest(AddUp); 

    // Add the calls to the request 
myRequest.addCall("GET", "http://www.mysite.com/Add.htm", [5,10]); 
myRequest.addCall("GET", "http://www.mysite.com/Add.htm", [4,6]); 
myRequest.addCall("GET", "http://www.mysite.com/Add.htm", [7,13]); 

    // Add the request to the pool 
myPool.addRequest(myRequest); 

注：

DPAJAX at DepressedPress.com

この非常に簡単な例では、3つの呼び出しとシングルハンドラに、呼び出しのために、その情報を渡して要求を1つ作成しますこのメソッドが提供されている他のソリューションの場合、実行されている呼び出しのシングルスレッド化を強制しません。それぞれが環境が許す限り速く実行されますが、ハンドラはすべてが完了したときにのみ呼び出されます。コンポーネントはユーザー定義の要求数もサポートしていますので、必要に応じて簡単にシングルスレッド化を強制できます。また、サービスが少し不安定な場合は、タイムアウト値と再試行の設定もサポートされます。

私は、この種の作業には非常に便利で（しかも信じられないほど簡単に理解できる）ことがわかりました。