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 der Maustaste oder Drücken einer Taste auf der Tastatur, oder durch APIs generiert werden, um den Fortschritt einer asynchronen Aufgabe darzustellen. Es kann auch programmatisch ausgelöst werden, etwa indem die Methode HTMLElement.click() eines Elements aufgerufen oder das Ereignis definiert und dann an ein bestimmtes Ziel gesendet wird, indem EventTarget.dispatchEvent() verwendet wird.

Es gibt viele Arten von Ereignissen, einige von ihnen verwenden andere Schnittstellen, die auf der Hauptschnittstelle Event basieren. 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 darauf zu "hören") und Code auszuführen, um sie zu verarbeiten (oder zu "handhaben"). Ereignis-Handler sind normalerweise mit verschiedenen HTML-Elementen (wie <button>, <div>, <span> usw.) verbunden (oder "angehängt") und ersetzen dabei im Allgemeinen die Verwendung der alten HTML Event-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, jeweils für ihre eigenen unabhängigen Zwecke. (Beispielsweise könnte eine Webseite sowohl ein Werbemodul als auch ein Statistikmodul haben, die beide das Ansehen von Videos überwachen.)

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

Schnittstellen, die auf Event basieren

Unten finden Sie eine Liste von Schnittstellen, die auf der Hauptschnittstelle Event basieren, mit Links zu ihrer jeweiligen Dokumentation in der MDN API-Referenz.

Beachten Sie, dass alle Ereignis-Schnittstellen 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 boolescher Wert, der angibt, ob das Ereignis durch den DOM nach oben "bubbelt".

Event.cancelable Schreibgeschützt

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

Event.composed Schreibgeschützt

Ein boolescher Wert, der anzeigt, ob das Ereignis über die Grenze zwischen dem Schatten-DOM und dem regulären DOM "bubbeln" kann.

Event.currentTarget Schreibgeschützt

Ein Verweis auf das derzeit registrierte Ziel des Ereignisses. Dies ist das Objekt, an das das Ereignis derzeit gesendet werden soll. Möglicherweise wurde dies durch Retargeting geändert.

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 Benutzer-Klick, zum Beispiel) oder durch ein Skript (mithilfe einer Methode zur Ereigniserstellung, zum Beispiel).

Event.srcElement Schreibgeschützt

Ein Alias für die Eigenschaft Event.target. 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

Der Zeitpunkt, zu dem das Ereignis erstellt wurde (in Millisekunden). Der Spezifikation nach ist dieser Wert die Zeit seit dem Beginn der Epoche—aber in Wirklichkeit variieren die Definitionen der Browser. Außerdem wird daran gearbeitet, dies stattdessen in einen DOMHighResTimeStamp umzuwandeln.

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 eines Ereignis-Handlers auf true gesetzt wird, wird die Ausbreitung 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 jegliche Retargetings erfolgt sind.

Event.returnValue

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

Event.scoped Schreibgeschützt

Ein boolescher Wert, der angibt, ob das gegebene Ereignis über die Schattenwurzel in das Standard-DOM "bubbelt". 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 (wenn es abbrechbar ist).

Event.stopImmediatePropagation()

Verhindert für dieses bestimmte Ereignis, dass alle anderen Listener aufgerufen werden. Dies gilt sowohl für Listener, die am selben Element angebracht sind, als auch für solche, die an Elementen angebracht sind, die später durchlaufen werden (zum Beispiel während der Erfassungsphase).

Event.stopPropagation()

Stoppt die Ausbreitung von Ereignissen weiter im DOM.

Veraltete Methoden

Event.initEvent()

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

Spezifikationen

Specification
DOM Standard
# interface-event

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch