2009-11-28 9 views
8

Cómo uso beforeSend devolución de llamada en $.getJSON (dominio cruzado).

Más específicamente $.getJSON es llamado es a un servicio YQL Como

seleccionar * de html donde url =”http://www.yahoo.com

+0

¿Para hacer qué, exactamente? – tvanfosson

+0

Para mostrar un gif de carga ... –

+1

¿Por qué no solo muestra el gif de carga ... y luego llama a getJSON? – James

Respuesta

28

El único propósito de beforeSend es obtener el objeto XHR sin procesar (normalmente para establecer encabezados HTTP en él). No lo necesita para expulsar spinners y cosas por el estilo. Este código aquí (de @petersendidit):

jQuery.ajax({ 
    url: url, 
    dataType: "json", 
    beforeSend: function(){ 
     $('.loading').show(); 
    } 
}); 

es mejor escribe así:

$('.loading').show(); 
jQuery.ajax({ 
    url: url, 
    dataType: "json" 
}); 

Lo que significa que, a menos que se necesitan opciones avanzadas en jQuery.ajax, su plan original para usar jQuery. getJSON está bien. Entonces dices que quieres mostrar un archivo GIF cargado, solo haz esto y olvídate del beforeSend.

jQuery(".someSpinnerImage").show(); 
jQuery.getJSON("http://www.somedomain.com/someurl", function(data) { 
    jQuery(".someSpinnerImage").hide(); 
    // Do something with data 
} 
1

Creo que desee utilizar $.ajaxStart() y $.ajaxStop(). Esos le permitirán mostrar y ocultar un gif de carga en las solicitudes ajax/JSON. También hace lo correcto si hay varias solicitudes ajax en curso.

5

$ .getJSON es sólo una función de atajo a la función $ .ajax

get: function(url, data, callback, type) { 
    // shift arguments if data argument was ommited 
    if (jQuery.isFunction(data)) { 
     callback = data; 
     data = null; 
    } 
    return jQuery.ajax({ 
     type: "GET", 
     url: url, 
     data: data, 
     success: callback, 
     dataType: type 
    }); 
}, 
getJSON: function(url, data, callback) { 
    return jQuery.get(url, data, callback, "json"); 
}, 

Así que si alguna vez tiene que hacer nada más que el getJSON Basic llama sólo tiene que utilizar $ .ajax como:

jQuery.ajax({ 
    url: url, 
    dataType: "json", 
    beforeSend: function(){ 
     $('.loading').show(); 
    } 
}); 

La otra opción es usar las funciones $.ajaxSend y $.ajaxComplete, pero esto hará que esas funciones se llamen antes y después de cada llamada ajax.

1

Creo que está utilizando JSONP para llamar a un script desde otro servidor. Hice mi tarea y no hay evento beforeSend en la llamada JSONP.

1

El método correcto es utilizar la devolución de llamada beforeSend, porque la devolución de llamada completa no se invoca en las consultas almacenadas en caché, porque una solicitud no se envía en esta instancia, por lo tanto, tampoco se llama a beforeSend.

Otra palabras, si muestra una imagen de carga antes de crear su solicitud $ .Ajax y confía en ocultarla al completar esa solicitud, si la consulta está en caché, su imagen de carga se bloqueará en "mostrar".

Este es el método correcto;

$.ajax({ 
url: url, 
dataType: "json", 
beforeSend: function() { 
    $('.loading').show(); 
}, 
success: function(data) { 
    // Do stuff... 
}, 
complete: function() { 
    $('.loading').hide(); 
}});