Wie sequenziere ich Ajax-Anfragen für eine optimale Kontrolle?

Sequenzierung von Ajax-Anfragen

Beim Durchlaufen einer Sammlung und beim Durchführen einzelner Ajax-Aufrufe für jedes Element ist es wichtig, die Reihenfolge zu steuern Verhindern Sie eine Serverüberlastung und ein Einfrieren des Browsers. Während benutzerdefinierte Iteratoren verwendet werden können, stehen elegantere Lösungen zur Verfügung.

jQuery 1.5

In jQuery 1.5 und höher das Plugin $.ajaxQueue() nutzt $.Deferred, $.queue() und $.ajax(), um die Anforderungssequenzierung zu verwalten und ein Versprechen bereitzustellen, das nach Abschluss der Anforderung aufgelöst wird.

Implementierung:

<br>(function($) {</p>
<p>var ajaxQueue = $({});</p>
<p>$.ajaxQueue = function( ajaxOpts ) {</p> <pre class="brush:php;toolbar:false">var jqXHR,
    dfd = $.Deferred(),
    promise = dfd.promise();

ajaxQueue.queue( doRequest );

promise.abort = function( statusText ) {
  if ( jqXHR ) {
    return jqXHR.abort( statusText );
  }
  var queue = ajaxQueue.queue(),
      index = $.inArray( doRequest, queue );
  if ( index > -1 ) {
    queue.splice( index, 1 );
  }
  dfd.rejectWith( ajaxOpts.context || ajaxOpts,
    [ promise, statusText, "" ] );
  return promise;
};

function doRequest( next ) {
  jqXHR = $.ajax( ajaxOpts )
    .done( dfd.resolve )
    .fail( dfd.reject )
    .then( next, next );
}

return promise;

};

})(jQuery);

jQuery 1.4

Für jQuery 1.4 kann die Animationswarteschlange zum Erstellen einer benutzerdefinierten „Warteschlange“ verwendet werden. Sie können auch Ihr eigenes $.ajaxQueue()-Plugin erstellen, das die „fx“-Warteschlange von jQuery verwendet, um automatisch die erste Anfrage in der Warteschlange zu initiieren, wenn diese nicht bereits ausgeführt wird.

Implementierung:

<br>(function($) {<br> var ajaxQueue = $({});</p>
<p>$.ajaxQueue = function(ajaxOpts) {</p> <pre class="brush:php;toolbar:false">var oldComplete = ajaxOpts.complete;

ajaxQueue.queue(function(next) {
  ajaxOpts.complete = function() {
    if (oldComplete) oldComplete.apply(this, arguments);
    next();
  };
  $.ajax(ajaxOpts);
});

};

})(jQuery);

Beispiel:

<br>$("#items li").each(function(idx) {<br> $.ajaxQueue({</p>
<pre class="brush:php;toolbar:false">url: '/echo/html/',
data: {html : "["+idx+"] "+$(this).html()},
type: 'POST',
success: function(data) {
  $("#output").append($("<li>", { html: data }));
}

});
});

Dadurch wird sichergestellt, dass jede Ajax-Anfrage nacheinander ausgeführt wird, was eine reibungslose Handhabung der Serverlast und die Beibehaltung der Reaktionsfähigkeit des Browsers ermöglicht.

Das obige ist der detaillierte Inhalt vonWie sequenziere ich Ajax-Anfragen für eine optimale Kontrolle?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!