ProgressEvent: ProgressEvent()-Konstruktor

type

Ein String mit dem Namen des Ereignisses. Er ist case-sensitiv und Browser setzen ihn auf loadstart, progress, abort, error, load, timeout oder loadend.

options Optional

Ein Objekt, das, zusätzlich zu den im Event() definierten Eigenschaften, die folgenden Eigenschaften haben kann:

lengthComputable Optional

Ein boolescher Wert, der angibt, ob die gesamte zu erledigende Arbeit und die bereits geleistete Arbeit des zugrunde liegenden Prozesses berechenbar ist. Mit anderen Worten, es sagt aus, ob der Fortschritt messbar ist oder nicht. Standardmäßig ist es false.

loaded Optional

Eine Zahl, die die bereits vom zugrunde liegenden Prozess geleistete Arbeit repräsentiert. Das Verhältnis der erledigten Arbeit kann mit der Eigenschaft und ProgressEvent.total berechnet werden. Beim Herunterladen einer Ressource mit HTTP repräsentiert dies nur den Teil des Inhalts selbst, nicht die Header und anderen Overheads. Standardmäßig ist es 0.

total Optional

Eine Zahl, die den gesamten Arbeitsumfang repräsentiert, den der zugrunde liegende Prozess gerade durchführt. Beim Herunterladen einer Ressource mit HTTP repräsentiert dies nur den Inhalt selbst, nicht die Header und anderen Overheads. Standardmäßig ist es 0.

Ein neues ProgressEvent-Objekt.

Das Beispiel demonstriert, wie ein ProgressEvent mit einem Konstruktor erstellt wird. Dies ist besonders nützlich zur Verfolgung des Fortschritts von Prozessen wie Datei-Uploads, Downloads oder anderen langlaufenden Aufgaben.

function updateProgress(loaded, total) {
  const progressEvent = new ProgressEvent("progress", {
    lengthComputable: true,
    loaded: loaded,
    total: total,
  });

  document.dispatchEvent(progressEvent);
}

document.addEventListener("progress", (event) => {
  console.log(`Progress: ${event.loaded}/${event.total}`);
});

updateProgress(50, 100);

• Die ProgressEvent-Schnittstelle, zu der es gehört.