jQuery Girl
  1. jQuery Girl
  3. comment afficher ajax loading image
Intereting Posts
Changer la couleur de fond en faisant défiler Comment implémenter l’effet carrousel en utilisant jQuery / JavaScript Essayer de cacher certaines options avec jquery ne fonctionne pas IE, Safari et Opera Chargement dynamic du contenu sur une page HTML locale Comment obtenir le premier paragraphe analysé de wikipedia? JavaScript séparé du fichier html – Comment faire basculer intelligemment les cases à cocher et les boutons activés Blueimp File Upload: supprime un fichier de la liste avant de l’envoyer jQuery affiche / masque un champ de texte basé sur une valeur de sélection déroulante et un radiobutton Chargement de plusieurs graphiques à secteurs Flot à partir d’un fichier js externe selon les besoins Comment charger une réponse Ajax dans le presse-papiers en utilisant jQuery et ZeroClipboard? créer un dialog sans id et append en jquery jQuery Décalage horaire Consumr des données JSON sans jQuery (sans getJSON) jQuery lorsque chacun est terminé, fonction de déclenchement jquery IE Fadein et Fadeout Opacity

comment afficher ajax loading image

Je veux montrer l’image de chargement ajax. mais je ne sais pas comment faire ça. voici mon script de travail ajax. aidez-moi s’il vous plaît à intégrer ajax loading gif.thanks 

$(function() { $( "#slider" ).slider({ stop: function(event, ui) { $.ajax({ url: "ajax.php", cache: false, async: false, data: "", success: function(html){ $("#result_list").html(html); } }); } }); }); 

 $(function() { $( "#slider" ).slider({ stop: function(event, ui) { $("#place_of_loading_image").show(); $.ajax({ url: "ajax.php", cache: false, async: false, data: "", success: function(html){ //got the data $("#place_of_loading_image").hide(); // hide ajax loader $("#result_list").html(html); // show downloaded content } }); } }); });

Où #place_of_loading_image est un conteneur (comme div ), dans un endroit où vous souhaitez que loader.gif apparaisse.

Avez-vous regardé blockui? http://jquery.malsup.com/block/ 

 $(function() { $( "#slider" ).slider({ stop: function(event, ui) { $.blockUI({ message: null }); //loading $.ajax({ url: "ajax.php", cache: false, async: false, data: "", success: function(html){ $.unblockUI(); //loading complete $("#result_list").html(html); } }); } }); });

Ajax a api ajax start et ajax stop, chaque fois qu’une demande ajax est envoyée, cette apis déclenche 

  $(document).bind("ajaxStart.mine", function() { $("#image").html(""); }); $(document).bind("ajaxStop.mine", function() { $("#image").html(""); });

Affichez et masquez votre image à l’aide de classes.

Avant de commencer votre XHR, affichez l’image de chargement.

Lors du rappel réussi de votre XHR, masquez l’image de chargement.

Quelque chose comme ça va aider.

Au début de votre fonction: 

 jQuery('#processing').html( '' ); $('#submit').attr("disabled", true);

En partie de votre fonction: 

 jQuery('#processing').html( '' ); $('#submit').attr("disabled", false);

Remarque:

doit figurer dans votre code HTML et vous pouvez définir la position de cette division DIV n’importe où sur la page à l’aide de css. Et définissez id='submit' pour ces boutons de soumission que vous souhaitez définir comme désactivé lors du traitement …