Frage jQuery Ajax Erfolg Callback-Funktionsdefinition


Ich möchte jQuery Ajax verwenden, um Daten von einem Server abzurufen.

Ich möchte die Definition der Erfolgs-Callback-Funktion außerhalb der .ajax() blockieren wie folgt. Also muss ich die Variable deklarieren dataFromServer wie folgt, damit ich die zurückgegebenen Daten vom Erfolgsrückruf verwenden kann?

Ich habe gesehen, dass die meisten Leute den Erfolgsrückruf innerhalb der .ajax() Block. Ist der folgende Code korrekt, wenn ich den Erfolgsrückruf außerhalb definieren möchte?

var dataFromServer;  //declare the variable first

function getData() {
    $.ajax({
        url : 'example.com',
        type: 'GET',
        success : handleData(dataFromServer)
    })
}

function handleData(data) {
    alert(data);
    //do some stuff
}

74
2018-02-07 15:19


Ursprung


Antworten:


Benutz einfach:

function getData() {
    $.ajax({
        url : 'example.com',
        type: 'GET',
        success : handleData
    })
}

Das success Eigenschaft erfordert nur einen Verweis auf eine Funktion und übergibt die Daten als Parameter an diese Funktion.

Sie können auf Ihre zugreifen handleData funktionieren so wegen des Weges handleData ist erklärt. JavaScript analysiert den Code vor dem Ausführen von Funktionsdeklarationen, damit Sie die Funktion im Code vor der eigentlichen Deklaration verwenden können. Dies ist bekannt als hissen.

Dies gilt jedoch nicht für Funktionen, die folgendermaßen deklariert sind:

var myfunction = function(){}

Diese sind nur verfügbar, wenn der Interpreter sie bestanden hat.

In dieser Frage finden Sie weitere Informationen zu den 2 Möglichkeiten, Funktionen zu deklarieren


79
2018-02-07 15:21



Die "neue" Methode, dies seit jQuery 1.5 (Januar 2011) zu tun, besteht darin, verzögerte Objekte zu verwenden, anstatt a success Rückrufen. Du solltest Rückkehr das Ergebnis von $.ajax und dann benutze die .done, .fail usw. Methoden zum Hinzufügen der Rückrufe außerhalb der $.ajax Anruf.

function getData() {
    return $.ajax({
        url : 'example.com',
        type: 'GET'
    });
}

function handleData(data /* , textStatus, jqXHR */ ) {
    alert(data);
    //do some stuff
}

getData().done(handleData);

Dies entkoppelt Die Callback-Behandlung aus der AJAX-Behandlung ermöglicht es Ihnen, mehrere Callbacks, Fehlerrückrufe usw. hinzuzufügen, ohne dass jemals das Original geändert werden muss getData() Funktion. Die Trennung der AJAX-Funktionalität von der Reihe von Aktionen, die anschließend ausgeführt werden, ist eine gute Sache!.

Deferred erlauben auch eine wesentlich einfachere Synchronisation mehrerer asynchroner Ereignisse, mit denen Sie nicht so einfach umgehen können success:

Zum Beispiel könnte ich mehrere Callbacks, einen Fehlerhandler hinzufügen und warten, bis ein Timer abgelaufen ist, bevor ich fortfahre:

// a trivial timer, just for demo purposes -
// it resolves itself after 5 seconds
var timer = $.Deferred();
setTimeout(timer.resolve, 5000);

// add a done handler _and_ an `error:` handler, even though `getData`
// didn't directly expose that functionality
var ajax = getData().done(handleData).fail(error);

$.when(timer, ajax).done(function() {
    // this won't be called until *both* the AJAX and the 5s timer have finished
});

ajax.done(function(data) {
    // you can add additional callbacks too, even if the AJAX call
    // already finished
});

Andere Teile von jQuery verwenden auch verzögerte Objekte - Sie können jQuery-Animationen sehr einfach mit anderen asynchronen Operationen synchronisieren.


167
2018-02-07 15:22



Ich weiß nicht, warum Sie den Parameter außerhalb des Skripts definieren. Das ist unnötig. Ihre Callback-Funktion wird automatisch mit den Rückgabedaten als Parameter aufgerufen. Es ist sehr gut möglich, Ihren Rückruf außerhalb der sucess: d.h.

function getData() {
    $.ajax({
        url : 'example.com',
        type: 'GET',
        success : handleData
    })
}

function handleData(data) {
    alert(data);
    //do some stuff
}

Die handleData-Funktion wird aufgerufen und der Parameter von der Ajax-Funktion übergeben.


12
2018-02-07 16:00



Versuchen Sie, Ihren Erfolgshandler erneut zu schreiben:

success : handleData

Die Erfolgseigenschaft der Ajax-Methode erfordert nur einen Verweis auf eine Funktion.

In Ihrer handleData-Funktion können Sie bis zu 3 Parameter eingeben:

object data
string textStatus
jqXHR jqXHR

5
2018-02-07 15:22



Ich würde schreiben :

var dataFromServer;  //declare the variable first

var handleData = function (data) {
    alert(data);
    //do some stuff
}


function getData() {
    $.ajax({
        url : 'example.com',
        type: 'GET',
        success : handleData
    })
}

3
2018-02-07 15:22



Sie müssen die Variable nicht deklarieren. Die Ajax-Erfolgsfunktion nimmt automatisch bis zu 3 Parameter an: Function( Object data, String textStatus, jqXHR jqXHR )


1
2018-02-07 15:22



Nach ein paar Stunden Spiel mit ihm und fast langweilig. Wunder kam zu mir, es funktioniert.

<pre>


var listname = [];   


 $.ajax({
    url : wedding, // change to your local url, this not work with absolute url
    success: function (data) {
       callback(data);
    }
});

function callback(data) {
      $(data).find("a").attr("href", function (i, val) {
            if( val.match(/\.(jpe?g|png|gif)$/) ) { 
             //   $('#displayImage1').append( "<img src='" + wedding + val +"'>" );
                 listname.push(val);
            } 
        });
}

function myfunction() {

alert (listname);

}

</pre>

1
2017-08-21 05:34



In Ihrer Komponente, d. H. Winkel JS-Code:

function getData(){
    window.location.href = 'http://localhost:1036/api/Employee/GetExcelData';
}

-1
2018-06-05 09:30