Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

Event

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.

Hinweis: Diese Funktion ist in Web Workers verfügbar.

Das Event-Interface repräsentiert ein Ereignis, das auf einem EventTarget stattfindet.

Ein Ereignis kann durch eine Benutzeraktion ausgelöst werden, z.B. durch Klicken der Maustaste oder Drücken der Tastatur, oder durch APIs generiert werden, um den Fortschritt einer asynchronen Aufgabe darzustellen. Es kann auch programmgesteuert ausgelöst werden, etwa durch den Aufruf der Methode HTMLElement.click() eines Elements oder durch die Definition des Ereignisses und dessen Versand an ein spezifiziertes Ziel mittels EventTarget.dispatchEvent().

Es gibt viele Arten von Ereignissen, von denen einige andere Schnittstellen basierend auf der Hauptschnittstelle Event verwenden. Event selbst enthält die Eigenschaften und Methoden, die allen Ereignissen gemeinsam sind.

Viele DOM-Elemente können so eingerichtet werden, dass sie diese Ereignisse akzeptieren (oder "beobachten") und Code ausführen, um sie zu verarbeiten (oder "handhaben"). Ereignis-Handler werden normalerweise mit verschiedenen HTML-Elementen (wie <button>, <div>, <span>, usw.) verbunden (oder "angehängt"), indem EventTarget.addEventListener() verwendet wird, was im Allgemeinen die alten HTML-Ereignis-Handler-Attribute ersetzt. Solche Handler können, wenn sie richtig hinzugefügt wurden, bei Bedarf auch über removeEventListener() getrennt werden.

Hinweis: Ein Element kann mehrere derartige Handler haben, selbst für genau dasselbe Ereignis—insbesondere, wenn separate, unabhängige Code-Module sie jeweils für eigene Zwecke anhängen. (Zum Beispiel eine Webseite, die ein Werbemodul und ein Statistikmodul enthält, die beide das Ansehen von Videos überwachen.)

Wenn es viele verschachtelte Elemente gibt, die jeweils einen eigenen Handler haben, kann die Ereignisverarbeitung sehr kompliziert werden—insbesondere, wenn ein übergeordnetes Element dasselbe Ereignis wie seine Kindelemente empfängt, weil sie "räumlich" überlappen und das Ereignis technisch in beiden auftritt. Die Verarbeitungsreihenfolge solcher Ereignisse hängt von den Event bubbling Einstellungen jedes ausgelösten Handlers ab.

Schnittstellen basierend auf Event

Im Folgenden finden Sie eine Liste der Schnittstellen, die auf der Hauptschnittstelle Event basieren, mit Links zu deren jeweiliger Dokumentation im MDN API Referenz.

Beachten Sie, dass alle Ereignisschnittstellen Namen haben, die mit "Event" enden.

Konstruktor

Event()

Erstellt ein Event-Objekt und gibt es an den Aufrufer zurück.

Instanz-Eigenschaften

Event.bubbles Schreibgeschützt

Ein Boolean-Wert, der angibt, ob das Ereignis durch das DOM nach oben "steigt".

Event.cancelable Schreibgeschützt

Ein Boolean-Wert, der angibt, ob das Ereignis abgebrochen werden kann.

Event.composed Schreibgeschützt

Ein Boolean, der angibt, ob das Ereignis über die Grenze zwischen dem Shadow DOM und dem regulären DOM steigen kann.

Event.currentTarget Schreibgeschützt

Eine Referenz auf das aktuell registrierte Ziel für das Ereignis. Dies ist das Objekt, an das das Ereignis aktuell gesendet werden soll. Es ist möglich, dass dies im Laufe der Zeit durch Retargeting geändert wurde.

Event.defaultPrevented Schreibgeschützt

Gibt an, ob der Aufruf von event.preventDefault() das Ereignis abgebrochen hat.

Event.eventPhase Schreibgeschützt

Gibt an, welche Phase des Ereignisflusses gerade verarbeitet wird. Es ist eine der folgenden Zahlen: NONE, CAPTURING_PHASE, AT_TARGET, BUBBLING_PHASE.

Event.isTrusted Schreibgeschützt

Gibt an, ob das Ereignis vom Browser (z.B. nach einem Benutzer-Klick) oder durch ein Skript (z.B. unter Verwendung einer Ereigniserstellungsmethode) initiiert wurde.

Event.srcElement Schreibgeschützt Veraltet

Ein Alias für die Event.target-Eigenschaft. Verwenden Sie stattdessen Event.target.

Event.target Schreibgeschützt

Eine Referenz auf das Objekt, an das das Ereignis ursprünglich gesendet wurde.

Event.timeStamp Schreibgeschützt

Der Zeitpunkt, zu dem das Ereignis erstellt wurde (in Millisekunden). Laut Spezifikation ist dieser Wert die Zeit seit Epoch—aber in der Realität variieren die Definitionen der Browser. Darüber hinaus wird daran gearbeitet, dies stattdessen in einen DOMHighResTimeStamp zu ändern.

Event.type Schreibgeschützt

Der Name, der den Typ des Ereignisses identifiziert.

Veraltete und nicht standardisierte Eigenschaften

Event.cancelBubble Veraltet

Ein historisches Alias zu Event.stopPropagation(), das stattdessen verwendet werden sollte. Wenn sein Wert vor der Rückgabe von einem Ereignis-Handler auf true gesetzt wird, wird die Verbreitung des Ereignisses verhindert.

Event.explicitOriginalTarget Nicht standardisiert Schreibgeschützt

Das explizite ursprüngliche Ziel des Ereignisses.

Event.originalTarget Nicht standardisiert Schreibgeschützt

Das ursprüngliche Ziel des Ereignisses, bevor irgendein Retargeting stattfand.

Event.returnValue Veraltet

Eine historische Eigenschaft, die immer noch unterstützt wird, um sicherzustellen, dass bestehende Seiten weiterhin funktionieren. Verwenden Sie stattdessen Event.preventDefault() und Event.defaultPrevented.

Event.scoped Schreibgeschützt Veraltet

Ein Boolean-Wert, der angibt, ob das gegebene Ereignis durch den Shadow-Root in das Standard-DOM "steigen" wird. Verwenden Sie stattdessen composed.

Instanz-Methoden

Event.composedPath()

Gibt den Pfad des Ereignisses zurück (ein Array von Objekten, auf denen Listener aufgerufen werden). Dies schließt keine Knoten in Schattenbäumen ein, wenn der Schatten-Root mit seinem ShadowRoot.mode im geschlossenen Modus erstellt wurde.

Event.preventDefault()

Hebt das Ereignis (wenn es abbrechbar ist) auf.

Event.stopImmediatePropagation()

Verhindert speziell für dieses Ereignis, dass alle anderen Listener aufgerufen werden. Dies schließt Listener ein, die an dasselbe Element angehängt sind, sowie solche, die an Elemente angehängt sind, die später durchlaufen werden (z.B. während der Erfassungsphase).

Event.stopPropagation()

Stoppt die Weiterverbreitung von Ereignissen im DOM.

Veraltete Methoden

Event.initEvent() Veraltet

Initialisiert den Wert eines erstellten Ereignisses. Wenn das Ereignis bereits gesendet wurde, tut diese Methode nichts. Verwenden Sie stattdessen den Konstruktor (Event()).

Spezifikationen

Specification
DOM
# interface-event

Browser-Kompatibilität

Siehe auch