type success example error javascript jquery ajax

javascript - example - jQuery ajax success callback function definition



ajax web (8)

En su componente, es decir, código JS angular:

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

Quiero usar jQuery ajax para recuperar datos de un servidor.

Quiero poner la definición de la función de devolución de llamada .ajax() fuera del bloque .ajax() como la siguiente. Entonces, ¿tengo que declarar la variable dataFromServer como la siguiente para que pueda usar los datos devueltos de la devolución de llamada correcta?

He visto a la mayoría de las personas definir la devolución de llamada exitosa dentro del bloque .ajax() . 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 }


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


La "nueva" forma de hacerlo desde jQuery 1.5 (enero de 2011) es utilizar objetos diferidos en lugar de pasar una devolución de llamada success . Debería devolver el resultado de $.ajax y luego usar los .done , .fail , etc. para agregar las devoluciones de llamada fuera de la llamada $.ajax .

function getData() { return $.ajax({ url : ''example.com'', type: ''GET'' }); } function handleData(data /* , textStatus, jqXHR */ ) { alert(data); //do some stuff } getData().done(handleData);

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

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.


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


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.


Solo usa:

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

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

Puede acceder a su función handleData esta manera debido a la forma en que se declara handleData . 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 hoisting .

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


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


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>