L'événement onreadystatechange
Quand une requête à un serveur est envoyé, nous voulons effectuer certaines actions en fonction de la réponse.
L'événement onreadystatechange est déclenché chaque fois que les changements readyState.
La propriété readyState détient le statut de l'objet XMLHttpRequest.
Trois propriétés importantes de l'objet XMLHttpRequest:
| Propriété | La description |
|---|---|
| onreadystatechange | Enregistre une fonction (ou le nom d'une fonction) à appeler automatiquement chaque fois que les changements de propriété readyState |
| readyState | Dit l'état de la XMLHttpRequest. Changements de 0 à 4: 0: demander non initialisée 1: connexion au serveur établie 2: demande reçue 3: demande de traitement 4: demander fini et la réponse est prête |
| status | 200: "OK" 404 Page non trouvée |
Dans le cas onreadystatechange, nous précisons ce qui se passera lorsque la réponse du serveur est prêt à être traité.
Lorsque readyState est 4 et l'état est de 200, la réponse est prête:
Exemple
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function()
{
if (xhttp.readyState == 4 && xhttp.status == 200) {
document.getElementById("demo").innerHTML = xhttp.responseText;
}
};
Essayez - le vous - même » Note: L'événement onreadystatechange est déclenché cinq fois (0-4), une fois pour chaque changement de readyState.
Utilisation d'une fonction de rappel
Une fonction de rappel est une fonction passée en paramètre à une autre fonction.
Si vous avez plus d'une tâche AJAX sur votre site, vous devez créer une fonction standard pour la création de l'objet XMLHttpRequest, et appeler cela pour chaque tâche AJAX.
L'appel de fonction doit contenir l'URL et ce qu'il faut faire sur onreadystatechange (qui est probablement différent pour chaque appel):
Exemple
function loadDoc(cFunc) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function()
{
if (xhttp.readyState == 4 && xhttp.status == 200) {
cFunc(xhttp);
} Essayez - le vous - même »