jQuery possède une riche bibliothèque de méthodes (fonctions) pour le développement d’AJAX.
Pour cela créer un fichier texte « test1.txt » avec le contenu suivant :
AJAX n'est pas un langage de programmation.<br />
C'est juste une technique pour créer de meilleurs applications web et plus interactif.
Placer le fichier texte dans le même dossier que le fichier html suivant de la demo.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery AJAX</title> <script type="text/javascript" src = " http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js " ></script> <script type="text/javascript"> $(document).ready(function(){ $("button").click(function(){ $("div.teste").load('test1.txt'); }); }); </script> </head> <body> <div class="teste"><h2>AJAX va changer le texte dans cet élément div si vous cliquez sur le bouton Changer</h2></div> <button>Changer </button> </body> </html>
AJAX = Asynchronous JavaScript and XML.
AJAX est une technique permettant de créer des pages web rapide et
dynamique.
AJAX permet de mettre à jour des pages web asynchrone en échangeant de
petites quantités de données avec le serveur dans les coulisses. Cela
signifie qu'il est possible de mettre à jour certaines parties d'une
page web, sans recharger la page entière.
Vous pouvez en apprendre plus sur AJAX dans notre tutoriel AJAX.
jQuery fournit un riche ensemble de méthodes pour le développement de web AJAX.
Avec AJAX jQuery, vous pouvez demander des données TXT, HTML, XML ou JSON d'un serveur distant en utilisant HTTP Get et HTTP Post.
Et vous pouvez charger des données distantes directement dans certains éléments HTML de votre page web !
La méthode load() jQuery est une fonction d'AJAX simple (mais très puissante). Elle possède la syntaxe suivante :
$(sélecteur) .load (url ,donnees, rappel )
Utilisez le sélecteur pour définir le ou les éléments HTML pour changer le contenu
et le paramètre url pour spécifier une adresse web pour vos données.
Voir l’exemple en haut.
Les deux autres paramètres donnees et rappel ne sont utilisés que dans les cas suivants :
Si vous voulez envoyer des données vers le serveur, vous devez utiliser le paramètre donnees .
Si vous avez besoin déclencher une fonction après achèvement, utilisez le paramètre de rappel . Le paramètre rappel ou callback est une fonction qui doit être exécutée après l'achèvement de la fonction load ()
$.Ajax(options) est la syntaxe de la fonction d'AJAX de bas niveau.
$.ajax offre plus de fonctionnalités que des fonctions de niveau supérieures comme load, get et post, mais il est aussi plus difficile à utiliser.
L'option paramètre prend les paires name|value définissant les données de l'url, mots de passe, les types de données, filtres, jeux de caractères, fonctions timeout et erreur.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery demo </title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("button").click(function(){ $.ajax({url:"test1.txt", success:function(result){ $("div").html(result); }}); });}); </script> </head> <body> <div><h2>Laissez AJAX changer ce texte</h2></div> <button>Changer le Contenu</button> </body> </html>
Pour une référence complète AJAX jQuery, s'il vous plaît aller à notre référence jQuery AJAX Méthodes .
Cours precedent: |
Sommaire de : JQuery |
Visiteurs Massifs Google
Comment Obliger Google à vous envoyer Gratuitement 500 visiteurs Minimum par Jour ?
Des Visiteurs Prêts à acheter vos produits....[Livre PDF, audio, et Vidéo]
Formation en ligne