Event

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: 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 mit der Maus oder Tippen auf die Tastatur, oder es wird von APIs generiert, um den Fortschritt einer asynchronen Aufgabe darzustellen. Es kann auch programmatisch ausgelöst werden, etwa durch Aufrufen der HTMLElement.click()-Methode eines Elements oder durch Definieren des Ereignisses und anschließendes Senden an ein bestimmtes Ziel mittels EventTarget.dispatchEvent().

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

Viele DOM-Elemente können eingerichtet werden, um diese Ereignisse zu akzeptieren (oder "zu überwachen") und Code auszuführen, um sie zu verarbeiten (oder "zu behandeln"). Ereignis-Handler werden in der Regel mit verschiedenen HTML-Elementen (wie <button>, <div>, <span>, usw.) verbunden (oder "angehängt"), indem EventTarget.addEventListener() verwendet wird, und dies ersetzt im Allgemeinen die Verwendung der alten HTML-Ereignis-Handler-Attribute. Darüber hinaus können solche Handler, wenn sie ordnungsgemäß hinzugefügt wurden, auch bei Bedarf mit removeEventListener() getrennt werden.

Hinweis: Ein Element kann mehrere solcher Handler haben, sogar für genau dasselbe Ereignis—insbesondere, wenn separate, unabhängige Code-Module sie anhängen, jedes für seinen eigenen unabhängigen Zweck. (Zum Beispiel eine Webseite mit einem Werbemodul und einem Statistikmodul, die beide das Ansehen von Videos überwachen.)

Wenn es viele verschachtelte Elemente gibt, von denen jedes seine eigenen Handler hat, kann die Ereignisverarbeitung sehr kompliziert werden—insbesondere dort, wo ein übergeordnetes Element dasselbe Ereignis wie seine Kindelemente erhält, da sie sich "räumlich" überlappen, sodass das Ereignis technisch in beiden auftritt, und die Verarbeitungsreihenfolge solcher Ereignisse hängt von den Ereignis-Bubbling-Einstellungen der jeweiligen ausgelösten Handler ab.

Schnittstellen basierend auf Event

Unten finden Sie eine Liste von Schnittstellen, die auf dem Haupt-Event-Interface basieren, mit Links zu ihrer jeweiligen Dokumentation im MDN API-Referenz.

Beachten Sie, dass alle Ereignis-Schnittstellen mit "Event" enden.

Konstruktor

Event()

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

Instanz-Eigenschaften

Event.bubbles Schreibgeschützt

Ein boolescher Wert, der angibt, ob das Ereignis durch das DOM nach oben blubbert.

Event.cancelable Schreibgeschützt

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

Event.composed Schreibgeschützt

Ein Boolescher Wert, der angibt, ob das Ereignis über die Grenze zwischen dem Schatten-DOM und dem regulären DOM blubbern kann.

Event.currentTarget Schreibgeschützt

Eine Referenz auf das derzeit registrierte Ziel für das Ereignis. Dies ist das Objekt, an das das Ereignis aktuell gesendet werden soll. Es ist möglich, dass sich dies entlang des Weges durch Retargeting geändert hat.

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 initiiert wurde (nach einem Benutzerklick, beispielsweise) oder durch ein Skript (mittels einer Ereigniserstellungsmethode, zum Beispiel).

Event.srcElement Schreibgeschützt

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

Event.target Schreibgeschützt

Ein Verweis auf das Objekt, an das das Ereignis ursprünglich gesendet wurde.

Event.timeStamp Schreibgeschützt

Die Zeit, zu der das Ereignis erstellt wurde (in Millisekunden). Laut Spezifikation ist dieser Wert die Zeit seit der Epoche—aber in Wirklichkeit 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

Ein historischer Alias zu Event.stopPropagation(), der stattdessen verwendet werden sollte. Wenn sein Wert vor der Rückgabe von einem Ereignishandler auf true gesetzt wird, wird die Weitergabe des Ereignisses verhindert.

Event.explicitOriginalTarget Schreibgeschützt

Das explizite ursprüngliche Ziel des Ereignisses.

Event.originalTarget Schreibgeschützt

Das ursprüngliche Ziel des Ereignisses, bevor es umgeleitet wurde.

Event.returnValue

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

Event.scoped Schreibgeschützt

Ein boolescher Wert, der angibt, ob das gegebene Ereignis über die Schattenwurzel in den Standard-DOM blubbern 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 die Schattenwurzel mit ihrem ShadowRoot.mode geschlossen erstellt wurde.

Event.preventDefault()

Bricht das Ereignis ab (falls es abbrechbar ist).

Event.stopImmediatePropagation()

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

Event.stopPropagation()

Stoppt die Weitergabe von Ereignissen im DOM.

Veraltete Methoden

Event.initEvent()

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

Spezifikationen

Specification
DOM
# interface-event

Browser-Kompatibilität

Siehe auch