Derniers tutoriels de développement web
 

jQuery - AJAX load() Method


jQuery load() Méthode

Le jQuery load() méthode est une méthode AJAX simple, mais puissant.

Les load() des données méthode de charges à partir d' un serveur et met les données renvoyées dans l'élément sélectionné.

Syntaxe:

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

Le paramètre d'URL requis spécifie l'URL que vous souhaitez charger.

Le paramètre de données en option spécifie un ensemble de querystring paires clé / valeur à envoyer avec la demande.

Le paramètre de rappel optionnel est le nom d'une fonction à exécuter après la load() méthode est terminée.

Voici le contenu de notre fichier d'exemple: "demo_test.txt" :

<h2>jQuery and AJAX is FUN!!!</h2>
<p id="p1">This is some text in a paragraph.</p>

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

Exemple

$("#div1").load("demo_test.txt");
Essayez - le vous - même »

Il est également possible d'ajouter un sélecteur jQuery au paramètre d'URL.

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

Exemple

$("#div1").load("demo_test.txt #p1");
Essayez - le vous - même »

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

  • responseTxt - contient le contenu résultant si l'appel réussit
  • statusTxt - contient l'état de l'appel
  • xhr - contient le XMLHttpRequest objet

L'exemple suivant affiche une alerte après la load() méthode complète. Si la load() méthode a réussi, il affiche "External content loaded successfully!" avec "External content loaded successfully!" , Et si elle échoue , il affiche un message d'erreur:

Exemple

$("button").click(function(){
    $("#div1").load("demo_test.txt", function(responseTxt, statusTxt, xhr){
        if(statusTxt == "success")
            alert("External content loaded successfully!");
        if(statusTxt == "error")
            alert("Error: " + xhr.status + ": " + xhr.statusText);
    });
});
Essayez - le vous - même »

jQuery AJAX Référence

Pour un aperçu complet de toutes les méthodes jQuery AJAX, s'il vous plaît visitez notre AJAX Référence jQuery .