Pregunta jQuery ajax success callback function definition


Quiero usar jQuery ajax para recuperar datos de un servidor.

Quiero poner la definición de la función de devolución de llamada exitosa fuera de la .ajax() bloquear como el siguiente. Entonces necesito declarar la variable dataFromServer como el siguiente para que pueda utilizar los datos devueltos de la devolución de llamada exitosa?

He visto a la mayoría de las personas definir la devolución de llamada de éxito dentro del .ajax() bloquear. Entonces, ¿es correcto el siguiente código si quiero definir la devolución de llamada exitosa afuera?

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


origen


Respuestas:


Solo usa:

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

los success la propiedad solo requiere una referencia a una función y pasa los datos como parámetro a esta función.

Puedes acceder a tu handleData funcionar así debido a la forma handleData es declarado. JavaScript analizará su código para las declaraciones de funciones antes de ejecutarlo, por lo que podrá usar la función en el código anterior a la declaración real. Esto se conoce como elevando.

Sin embargo, esto no cuenta para funciones declaradas así:

var myfunction = function(){}

Esos solo están disponibles cuando el intérprete los aprobó.

Consulte esta pregunta para obtener más información sobre las 2 formas de declarar funciones


79
2018-02-07 15:21



La "nueva" forma de hacerlo desde jQuery 1.5 (enero de 2011) es utilizar objetos diferidos en lugar de pasar un success llamar de vuelta. Debieras regreso el resultado de $.ajax y luego usa el .done, .fail etc métodos para agregar las devoluciones de llamada fuera de la $.ajax llamada.

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

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

getData().done(handleData);

Esta desacoplamientos el manejo de devolución de llamada desde el manejo de AJAX, le permite agregar múltiples devoluciones de llamadas, devoluciones de llamadas, etc., todo sin tener que modificar el original getData() función. Separar la funcionalidad AJAX del conjunto de acciones que se completarán después es ¡una cosa buena!.

Los aplazamientos también permiten una sincronización mucho más fácil de múltiples eventos asíncronos, lo cual no se puede hacer fácilmente con success:

Por ejemplo, podría agregar varias devoluciones de llamada, un controlador de errores y esperar a que transcurra un tiempo antes de continuar:

// 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
});

Otras partes de jQuery también usan objetos diferidos: puede sincronizar las animaciones jQuery con otras operaciones asincrónicas muy fácilmente con ellas.


167
2018-02-07 15:22



No sé por qué estás definiendo el parámetro fuera del guión. Eso es innecesario. Se llamará a su función de devolución de llamada con los datos de retorno como un parámetro automáticamente. Es muy posible definir su devolución de llamada fuera del sucess: es decir

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

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

se llamará a la función handleData y se le pasará el parámetro por la función ajax.


12
2018-02-07 16:00



Intenta volver a escribir tu controlador de éxito para:

success : handleData

La propiedad de éxito del método ajax solo requiere una referencia a una función.

En su función handleData puede tomar hasta 3 parámetros:

object data
string textStatus
jqXHR jqXHR

5
2018-02-07 15:22



Yo escribiría :

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



No necesita declarar la variable. La función de éxito de Ajax toma automáticamente hasta 3 parámetros: Function( Object data, String textStatus, jqXHR jqXHR )


1
2018-02-07 15:22



después de algunas horas, juega con él y casi se vuelve aburrido. el milagro vino a mí, funciona.

<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