it-swarm.com.de

jQuery.ajax-Behandlung Antworten fortsetzen: "Erfolg:" vs ".done"?

Ich arbeite jetzt seit ein paar Wochen mit jQuery und AJAX= und habe zwei verschiedene Möglichkeiten gesehen, das Skript fortzusetzen, sobald der Aufruf erfolgt ist: success: und .done.

Aus der Zusammenfassung der jQuery-Dokumentation erhalten wir:

.done (): Beschreibung: Fügen Sie Handler hinzu, die beim Auflösen des verzögerten Objekts aufgerufen werden sollen.

success: (.ajax () - Option): Eine Funktion, die aufgerufen wird, wenn die Anforderung erfolgreich ist.

Also tun beide etwas, nachdem der AJAX Aufruf abgeschlossen/aufgelöst wurde. Kann ich den einen oder anderen zufällig verwenden? Was ist der Unterschied und wann wird einer anstelle des anderen verwendet?

301
Claudio

success war der traditionelle Name des Erfolgsrückrufs in jQuery, der als Option im Ajax-Aufruf definiert wurde. Seit der Implementierung von $.Deferreds und komplexeren Rückrufen ist done die bevorzugte Methode zur Implementierung erfolgreicher Rückrufe, da sie für jeden deferred aufgerufen werden kann.

Zum Beispiel Erfolg:

$.ajax({
  url: '/',
  success: function(data) {}
});

Zum Beispiel erledigt:

$.ajax({url: '/'}).done(function(data) {});

Das Schöne an done ist, dass der Rückgabewert von $.ajax jetzt ein verzögertes Versprechen ist, das an eine andere Stelle in Ihrer Anwendung gebunden werden kann. Nehmen wir also an, Sie möchten diesen Ajax-Anruf von verschiedenen Orten aus tätigen. Anstatt Ihre Erfolgsfunktion als Option an die Funktion zu übergeben, die diesen Ajax-Aufruf ausführt, können Sie einfach die Funktion $.ajax selbst zurückgeben lassen und Ihre Rückrufe mit done, fail, then oder was auch immer verknüpfen. Beachten Sie, dass always ein Rückruf ist, der ausgeführt wird, ob die Anforderung erfolgreich ist oder fehlschlägt. done wird nur bei Erfolg ausgelöst.

Zum Beispiel:

function xhr_get(url) {

  return $.ajax({
    url: url,
    type: 'get',
    dataType: 'json',
    beforeSend: showLoadingImgFn
  })
  .always(function() {
    // remove loading image maybe
  })
  .fail(function() {
    // handle request failures
  });

}

xhr_get('/index').done(function(data) {
  // do stuff with index data
});

xhr_get('/id').done(function(data) {
  // do stuff with id data
});

Ein wichtiger Vorteil in Bezug auf die Wartbarkeit besteht darin, dass Sie Ihren Ajax-Mechanismus in eine anwendungsspezifische Funktion eingebunden haben. Wenn Sie beschließen, dass Ihr $.ajax -Aufruf in Zukunft anders ausgeführt werden soll oder Sie eine andere Ajax-Methode verwenden oder sich von jQuery entfernen, müssen Sie nur die xhr_get -Definition ändern (Stellen Sie sicher, dass Sie ein Versprechen oder mindestens eine done -Methode zurückgeben, im obigen Beispiel). Alle anderen Referenzen in der App können gleich bleiben.

Es gibt viel mehr (viel coolere) Dinge, die Sie mit $.Deferred tun können. Eine davon besteht darin, pipe zu verwenden, um einen Fehler bei einem vom Server gemeldeten Fehler auszulösen, selbst wenn $.ajax Anfrage selbst ist erfolgreich. Zum Beispiel:

function xhr_get(url) {

  return $.ajax({
    url: url,
    type: 'get',
    dataType: 'json'
  })
  .pipe(function(data) {
    return data.responseCode != 200 ?
      $.Deferred().reject( data ) :
      data;
  })
  .fail(function(data) {
    if ( data.responseCode )
      console.log( data.responseCode );
  });
}

xhr_get('/index').done(function(data) {
  // will not run if json returned from ajax has responseCode other than 200
});

Weitere Informationen zu $.Deferred finden Sie hier: http://api.jquery.com/category/deferred-object/

[~ # ~] Anmerkung [~ # ~] : Ab jQuery 1.8 wurde pipe nicht mehr empfohlen, then genau so zu verwenden.

451
glortho

Wenn Sie in Ihrem Ajax async: false Benötigen, sollten Sie success anstelle von .done Verwenden. Ansonsten ist es besser, .done Zu verwenden. Dies ist von jQuery offizielle Seite :

Ab jQuery 1.8 ist die Verwendung von async: false mit jqXHR ( $ .Deferred) ist veraltet; Sie müssen die Rückrufoptionen Erfolg/Fehler/Vollständig verwenden anstelle von die entsprechenden Methoden des jqXHR-Objekts wie jqXHR.done () .

4