Comment puis-je afficher un indicateur de chargement lors des requêtes jQuery AJAX ?

Affichage de l'indication de chargement lors des requêtes $.ajax

Question :

Comment puis-je afficher un indicateur visuel lors d'un travail asynchrone La requête HTTP est effectuée à l'aide de $.ajax ?

Réponse :

Pour indiquer qu'une requête asynchrone est en cours de traitement, vous pouvez utiliser le chargement d'images. Voici deux méthodes pour ce faire :

Méthode 1 : Contrôle d'affichage en ligne

Afficher l'image de chargement avant la requête et la masquer une fois la requête terminée :

$('#loading-image').show();
$.ajax({
  url: uri,
  cache: false,
  success: function(html){
    $('.info').append(html);
  },
  complete: function(){
    $('#loading-image').hide();
  }
});

Méthode 2 : liaison d'événement globale

Lier l'affichage de l'image de chargement aux événements globaux ajaxStart et ajaxStop. Cette approche fera basculer l'image pour toutes les requêtes ajax :

$('#loading-image').bind('ajaxStart', function(){
  $(this).show();
}).bind('ajaxStop', function(){
  $(this).hide();
});

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!