Ajax リクエストのシーケンス

多くの Web アプリケーションでは、コレクションを反復処理して要素ごとに Ajax リクエストを発行する必要が生じることがよくあります。ブラウザのフリーズを避けるために非同期リクエストを活用するのは魅力的ですが、これらのリクエストを効果的に管理することで、サーバーの過負荷やその他の潜在的な問題を防ぐことができます。

jQuery 1.5

jQuery バージョン 1.5 以降の場合、$. ajaxQueue() プラグインは簡単な解決策を提供します。このプラグインは、$.Deferred、.queue()、および $.ajax() 関数を利用して Ajax リクエストを調整し、リクエストの完了時に解決される Promise を返します。

jQuery 1.4

jQuery の場合1.4 ユーザーの場合は、空のオブジェクトのアニメーション キューを使用して「キュー」を作成する別のアプローチもあります。この手法により、Ajax リクエストが制御された方法で実行され、キューがまだ実行されていない場合は最初のリクエストが自動的に開始されます。

使用例

次のコード スニペットは、Ajax の実装方法を示しています。 $.ajaxQueue() プラグインを使用したキューイング。要素のリストを反復処理し、Ajax リクエストを介して各項目をターゲット リストにコピーします。

$("#items li").each(function(idx) {
  $.ajaxQueue({
    url: '/echo/html/',
    data: { html: "["   idx   "] "   $(this).html() },
    type: 'POST',
    success: function(data) {
      $("#output").append($("