Comment obtenir les états de lecture Jquery Ajax

Comment puis-je connaître les readstates d’une requête ajax via jquery? En général, sans utiliser jquery, nous enverrons une requête ajax comme celle-ci:

http.open("POST", url, true); http.onreadystatechange = function() { if(http.readyState == 4 && http.status == 200) { // do something } }

Donc, je peux facilement suivre la valeur de readystate de 1 à 4 en utilisant le code ci-dessus, et effectuer les actions nécessaires comme montrer une icône de chargement lorsque readystate est à 1.

Mais via un appel ajax jQuery, comment puis-je suivre les valeurs readystate?

Je passe un appel ajax via jquery comme ceci:

 $.post('ajax/test.html', function(data) { $('.result').html(data); });

Regardez la documentation de $.ajax . Vous avez la possibilité de passer différents rappels (peut-être pas pour “l’état prêt” mais c’est suffisant pour un indicateur):

beforeSend(jqXHR, settings) Fonction
Fonction de rappel préalable à la demande pouvant être utilisée pour modifier l’object jqXHR (dans jQuery 1.4.x, XMLHTTPRequest ) avant son envoi. Utilisez-le pour définir des en-têtes personnalisés, etc. Les jqXHR et des settings sont transmis en tant qu’arguments. Ceci est un événement Ajax. Renvoyer false dans la fonction beforeSend annulera la demande. A partir de jQuery 1.5, l’option beforeSend sera appelée quel que soit le type de demande.

success(data, textStatus, jqXHR) Fonction, Tableau
Une fonction à appeler si la requête aboutit. La fonction reçoit trois arguments: Les data renvoyées par le serveur, formatées en fonction du paramètre dataType ; une chaîne décrivant le statut; et l’object jqXHR (dans jQuery 1.4.x, XMLHttpRequest ). À partir de jQuery 1.5, le paramètre success peut accepter un tableau de fonctions. Chaque fonction sera appelée à tour de rôle. Ceci est un événement Ajax .

error(jqXHR, textStatus, errorThrown) Fonction
Une fonction à appeler si la requête échoue. La fonction reçoit trois arguments: l’object jqXHR (dans jQuery 1.4.x, XMLHttpRequest ), une chaîne décrivant le type d’erreur survenue et un object exception facultatif, le cas échéant. Les valeurs possibles pour le deuxième argument (outre null ) sont "timeout" , "error" , "abort" et "parsererror" . Ceci est un événement Ajax . À partir de jQuery 1.5, le paramètre d’ error peut accepter un tableau de fonctions. Chaque fonction sera appelée à tour de rôle. Remarque: Ce gestionnaire n’est pas appelé pour les requêtes de script interdomaine et JSONP.

complete(jqXHR, textStatus) , Array
Une fonction à appeler à la fin de la demande (après exécution des rappels d’ error et d’ error ). La fonction reçoit deux arguments: l’object jqXHR (dans jQuery 1.4.x, XMLHTTPRequest ) et une chaîne catégorisant le statut de la demande ( "success" , "notmodified" , "error" , "timeout" , "abort" , ou "parsererror" ). À partir de jQuery 1.5, le paramètre complete peut accepter un tableau de fonctions. Chaque fonction sera appelée à tour de rôle. Ceci est un événement Ajax .

La meilleure idée serait donc d’afficher l’indicateur dans le rappel passé à beforeSend et de le masquer complete .

Exemple:

Vous devrez donc réécrire votre code comme suit:

 $.ajax({ url: 'ajax/test.html', type: 'POST', beforeSend: function() { // show indicator }, complete: function() { // hide indicator }, success: function(data) { $('.result').html(data); } });

Bien que je ne comprenne pas pourquoi vous utilisez POST car vous n’envoyez aucune donnée (du moins dans votre exemple de code).

utilisation

 $.ajax({ url:, success:function(){ }//This is ready state 4 });

perform necessary action like showing a loading icon when readystate is 1.

pour cela, vous pouvez utiliser ajaxStart et ajaxStop

http://api.jquery.com/category/ajax/ Je pense que vous constaterez que les différents événements correspondent aux différents readyStates.