Notes d'étude jQuery - Opération Ajax (3) - Process Processing_jquery

Fonction d'observation

Les fonctions ajaxStart et ajaxStop peuvent être utilisées comme fonctions d'observation, et nous pouvons utiliser la fonction de rappel de la fonction d'observation pour effectuer le traitement correspondant.

La fonction de rappel d'ajaxStart est déclenchée lorsque la requête Ajax démarre et qu'aucune autre transmission n'a été effectuée.
Lorsque la dernière requête active se termine, la fonction de rappel enregistrée via ajaxStop est exécutée.
Puisque la fonction d'observation est globale, elle doit être appelée en utilisant $(document). Nous testons les deux fonctions en utilisant la méthode Ajax pour obtenir un exemple d'image :
La page actuelle est :

<div></div>
<button>load</button>

Le contenu de test.html dans le même répertoire est :

<img src="avatar.jpg" />

Vous souhaitez charger une image après avoir cliqué sur le bouton :

 $('button').click(function() {
  $('div').load('test.html');
 });

À ce stade, nous pouvons utiliser les fonctions ajaxStart et ajaxStop pour ajouter des invites :

 $(document).ajaxStart(function() {//
  alert('load a picture');
 }).ajaxStop(function() {
  alert('show a picture');
 });
 $('button').click(function() {
  $('div').load('test.html');
 });

Après avoir cliqué sur le bouton à ce moment-là, il vous demandera de charger une image avant que l'image ne soit chargée et d'afficher une image après le chargement.

Gestion des erreurs

La méthode la plus couramment utilisée est la méthode globale ajaxError. Prenons l'exemple ci-dessus comme exemple Si nous envoyons une demande de données à une page qui n'existe pas :

 $(document).ajaxError(function() {//
  alert('load failed!');
 });
 $('button').click(function() {
  $('div').load('noexsited.html');
 });

Après avoir cliqué sur le bouton à ce moment :

Pour les méthodes sans chargement, vous pouvez également utiliser la méthode fail pour le traitement de concaténation :

 $('button').click(function() {
  $.get('noexsited.html', function(data) {

  }).fail(function(jqXHR) {
   alert('status is ' + jqXHR.status);
  });
 });

JSONP

JSONP est un JSON avec remplissage, JSON rembourré, qui utilise la balise 3f1c4e4b6b16bbbd69b2ee476dc4f83a pour obtenir des fichiers Javascript sur plusieurs domaines, afin que les données JSON puissent être obtenues sur tous les domaines.
Le format de JSONP consiste à envelopper un fichier JSON standard dans une paire de parenthèses précédées d'une chaîne arbitraire. Cette chaîne, appelée P, est déterminée par le client qui demande les données.
Le même bouton que dans l'exemple ci-dessus, nous définissons d'abord le contenu de la page du domaine externe otherdomain.com/index.php sur :

<&#63;php
$data = '{ "name": "stephenlee", "sex": "male" }';
echo $_GET['callback'] .'('. $data .')';

Nous utilisons un espace réservé spécial ? pour réaliser une acquisition inter-domaines de données JSON :

 $('button').click(function() {
  $.getJSON('otherdomain.com/index.php?callback=?', function(data) {
   console.log(data);
  });
 });

L'acquisition des données a réussi.