Die onreadystatechange Veranstaltung
Wenn eine Anforderung an einen Server gesendet wird, möchten wir einige Aktionen auf die Antwort basierend auszuführen.
Die onreadystatechange Ereignis wird jedesmal, wenn der Readystate Veränderungen ausgelöst.
Die Readystate Eigenschaft hält den Status des XMLHttpRequest.
Drei wichtige Eigenschaften des XMLHttpRequest-Objekt:
Eigentum | Beschreibung |
---|---|
onreadystatechange | Speichert eine Funktion (oder der Name einer Funktion), um automatisch jedes Mal, wenn die Readystate-Eigenschaft ändert aufgerufen werden |
readyState | Hält den Status des XMLHttpRequest. Änderungen 0-4: 0: Anforderung nicht initialisiert 1: Server-Verbindung hergestellt 2: Anforderung empfangen 3: Verarbeitungsanforderung 4: fordern fertig und Antwort bereit ist, |
status | 200: "OK" 404 Seite nicht gefunden |
Im onreadystatechange Ereignis, geben wir das, was passieren wird, wenn die Antwort des Servers bereit ist, verarbeitet zu werden.
Wenn Readystate 4 und Status ist 200, ist die Antwort bereit:
Beispiel
function loadDoc() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function()
{
if (xhttp.readyState == 4 && xhttp.status == 200) {
document.getElementById("demo").innerHTML = xhttp.responseText;
}
};
Versuch es selber " Hinweis: Die onreadystatechange Ereignis fünfmal ausgelöst wurde (0-4), einmal für jede Änderung in der Readystate.
Mit Hilfe einer Callback-Funktion
Eine Rückruffunktion ist eine Funktion als Parameter an eine andere Funktion übergeben.
Wenn Sie mehr als eine AJAX Aufgabe haben, auf Ihrer Website, sollten Sie eine Standardfunktion erstellen Sie das XMLHttpRequest-Objekt für das Erstellen, und rufen Sie dies für jede AJAX Aufgabe.
Der Funktionsaufruf sollte die URL enthalten, und was auf onreadystatechange zu tun (die für jeden Anruf wahrscheinlich anders ist):
Beispiel
function loadDoc(cFunc) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function()
{
if (xhttp.readyState == 4 && xhttp.status == 200) {
cFunc(xhttp);
}
Versuch es selber "