if (window.XMLHttpRequest) // Objet de la fenêtre courant { xhr = new XMLHttpRequest(); // Firefox, Safari, ... } else if (window.ActiveXObject) // Version Active { xhr = new ActiveXObject("Microsoft.XMLHTTP"); // Internet Explorer }ou plus simplement, on peut utiliser les exceptions:
try {
xhr = new ActiveXObject("Microsoft.XMLHTTP"); // Essayer Internet Explorer
}
catch(e) // Echec{
xhr = new XMLHttpRequest(): // Autres navigateurs
}Seconde étape: attendre la réponse
Le traitement de la réponse et les traitements qui suivent sont inclus dans une fonction, et la valeur de retour de cette fonction sera assignée à l'attribut onreadystatechange de l'objet précédemment créé.xhr.onreadystatechange = function(){ // instructions de traitement de la réponse }; if (xhr.readyState == 4) { // Reçu, OK } else { // Attendre... } Troisième étape: faire la requête elle-même
Deux méthodes de XMLHttpRequest sont utilisées:- open: commande GET ou POST, URL du document, true pour asynchrone.
- send: avec POST seulement, données à envoyer au serveur.
La requête ci-dessous lit un document sur le serveur.
xhr.open('GET', 'http://www.xul.fr/fichier.xml', true);
xhr.send(null);Exemple de programme Ajax
Lire un texte
<html>
<head>
<script>
function submitForm()
{
var xhr;
try { xhr = new ActiveXObject('Msxml2.XMLHTTP'); }
catch (e)
{
try { xhr = new ActiveXObject('Microsoft.XMLHTTP'); }
catch (e2)
{
try { xhr = new XMLHttpRequest(); }
catch (e3) { xhr = false; }
}
}
xhr.onreadystatechange = function()
{
if(xhr.readyState == 4)
{
if(xhr.status == 200)
document.ajax.dyn="Received:" + xhr.responseText;
else
document.ajax.dyn="Error code " + xhr.status;
}
};
xhr.open( GET", "data.xml", true);
xhr.send(null);
}
</script>
</head>
<body>
<FORM method="POST" name="ajax" action="">
<INPUT type="BUTTON" value="Submit" ONCLICK="submitForm()">
<INPUT type="text" name="dyn" value="">
</FORM>
</body>
</html>
RSS Feed (xml)
Aucun commentaire:
Enregistrer un commentaire