jQuery - Méthode AJAX load()

Méthode load() jQuery

La méthode jQuery load() est une méthode AJAX simple mais puissante.

La méthode load() charge des données depuis le serveur et place les données renvoyées dans l'élément sélectionné.

Syntaxe :

$(selector).load(URL,data,callback);

ObligatoireURLLe paramètre spécifie l'URL que vous souhaitez charger.

FacultatifdataLe paramètre spécifie l'ensemble des paires clé/valeur de la chaîne de requête à envoyer avec la requête.

FacultatifcallbackLe paramètre est le nom de la fonction à exécuter une fois la méthode load() terminée.

Voici le contenu du fichier d'exemple ("demo_test.txt") :

<h2>jQuery AJAX est une fonctionnalité vraiment géniale !</h2> <p id="p1">Ceci est un texte dans un paragraphe.</p>

L'exemple suivant charge le contenu du fichier "demo_test.txt" dans l'élément <div> spécifié :

Exemple

$("#div1").load("demo_test.txt");

Essayez-le vous-même »

Vous pouvez également ajouter un sélecteur jQuery au paramètre URL.

L'exemple suivant charge le contenu de l'élément avec id="p1" dans le fichier "demo_test.txt" dans l'élément <div> spécifié :

Exemple

$("#div1").load("demo_test.txt #p1");

Essayez-le vous-même »

Le paramètre de rappel optionnel spécifie la fonction de rappel à exécuter lorsque la méthode load() se termine. La fonction de rappel peut avoir différents paramètres :

  • responseTxt- Contient le contenu du résultat lorsque l'appel réussit
  • statusTXT- Contient le statut de l'appel
  • xhr- Contient l'objet XMLHttpRequest

L'exemple suivant affiche une boîte d'alerte après la fin de la méthode load(). Si la méthode load() réussit, elle affiche "Contenu externe chargé avec succès !", et si elle échoue, elle affiche un message d'erreur :

Exemple

$("button").click(function(){ $("#div1").load("demo_test.txt",function(responseTxt,statusTxt,xhr){ if(statusTxt=="success") alert("Contenu externe chargé avec succès !"); if(statusTxt=="error") alert("Erreur : "+xhr.status+": "+xhr.statusText); }); });

Essayez-le vous-même »
Autres extensions