ProgressEvent
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Hinweis: Dieses Feature ist verfügbar in Web Workers.
Das ProgressEvent
-Interface repräsentiert Ereignisse, die den Fortschritt eines zugrunde liegenden Prozesses messen, wie eine HTTP-Anfrage (für ein XMLHttpRequest
) oder das Laden der zugrunde liegenden Ressource eines <img>
, <audio>
, <video>
, <style>
oder <link>
.
Konstruktor
ProgressEvent()
-
Erstellt ein
ProgressEvent
-Ereignis mit den angegebenen Parametern.
Instanz-Eigenschaften
Erbt auch Eigenschaften von seinem Elternteil Event
.
ProgressEvent.lengthComputable
Nur lesbar-
Ein boolesches Kennzeichen, das anzeigt, ob das Verhältnis zwischen der bereits übertragenen oder verarbeiteten Datenmenge (
loaded
) und der Gesamtdatenmenge (total
) berechenbar ist. Mit anderen Worten, es gibt an, ob der Fortschritt messbar ist oder nicht. ProgressEvent.loaded
Nur lesbar-
Eine 64-Bit-Integer, die die Größe in Bytes der bereits übertragenen oder verarbeiteten Daten angibt. Das Verhältnis kann berechnet werden, indem
ProgressEvent.total
durch den Wert dieser Eigenschaft geteilt wird. Beim Herunterladen einer Ressource über HTTP zählt dies nur den Hauptteil der HTTP-Nachricht und schließt Header und andere Overhead nicht ein. Beachten Sie, dass bei komprimierten Anfragen unbekannter Gesamtgrößeloaded
die Größe der komprimierten oder dekomprimierten Daten enthalten kann, abhängig vom Browser. Ab 2024 enthält es die Größe der komprimierten Daten in Firefox und die Größe der unkomprimierten Daten in Chrome. ProgressEvent.total
Nur lesbar-
Eine 64-Bit-Integer, die die Gesamtgröße in Bytes der übertragenen oder verarbeiteten Daten angibt. Beim Herunterladen einer Ressource über HTTP wird dieser Wert aus dem
Content-Length
Antwort-Header entnommen. Es zählt nur den Hauptteil der HTTP-Nachricht und schließt Header und anderen Overhead nicht ein.
Instanz-Methoden
Erbt Methoden von seinem Elternteil, Event
.
Beispiele
Das folgende Beispiel fügt einem neuen XMLHTTPRequest
ein ProgressEvent
hinzu und verwendet es, um den Status der Anfrage anzuzeigen.
const progressBar = document.getElementById("p"),
client = new XMLHttpRequest();
client.open("GET", "magical-unicorns");
client.onprogress = (pe) => {
if (pe.lengthComputable) {
progressBar.max = pe.total;
progressBar.value = pe.loaded;
}
};
client.onloadend = (pe) => {
progressBar.value = pe.loaded;
};
client.send();
Spezifikationen
Specification |
---|
XMLHttpRequest Standard # interface-progressevent |
Browser-Kompatibilität
BCD tables only load in the browser
Siehe auch
- Das
Event
Basis-Interface.