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.

Die Event-Schnittstelle repräsentiert ein Ereignis, das auf einem EventTarget stattfindet.

Ein Ereignis kann durch eine Benutzeraktion ausgelöst werden, z. B. durch Klicken auf eine Maustaste oder Tippen auf die Tastatur, oder es kann von APIs generiert werden, um den Fortschritt einer asynchronen Aufgabe zu repräsentieren. Es kann auch programmatisch ausgelöst werden, z. B. durch Aufrufen der HTMLElement.click()-Methode eines Elements oder durch Definieren des Ereignisses, das dann mit EventTarget.dispatchEvent() an ein bestimmtes Ziel gesendet wird.

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 "lauschen") und Code als Reaktion darauf ausführen, um sie zu verarbeiten (oder "handhaben"). Ereignis-Handler sind in der Regel mit verschiedenen HTML-Elementen (wie <button>, <div>, <span>, usw.) verbunden (oder "angebunden") unter Verwendung von EventTarget.addEventListener(), und dies ersetzt im Allgemeinen die Verwendung der alten HTML-Ereignis-Handler-Attribute. Außerdem können solche Handler, wenn sie ordnungsgemäß hinzugefügt werden, auch bei Bedarf mit removeEventListener() wieder getrennt werden.

Hinweis: Ein Element kann mehrere solcher Handler haben, selbst für das exakt gleiche Ereignis—insbesondere wenn separate, unabhängige Code-Module sie zu eigenen unabhängigen Zwecken anfügen. (Zum Beispiel eine Webseite mit einem Anzeigenmodul 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 komplex werden – insbesondere wenn ein Elternelement dasselbe Ereignis wie seine Kindelemente empfängt, weil sie "räumlich" überlappen, sodass das Ereignis technisch in beiden auftritt, und die Verarbeitungsreihenfolge solcher Ereignisse hängt von den Event Bubbling-Einstellungen jedes ausgelösten Handlers ab.

Schnittstellen basierend auf Event

Unten ist eine Liste von Schnittstellen, die auf der Hauptschnittstelle Event basieren, mit Links zu ihrer jeweiligen Dokumentation im 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.

Instanzeigenschaften

Event.bubbles Schreibgeschützt: Ein boolescher Wert, der angibt, ob das Ereignis durch das DOM blubbert oder nicht.
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 Shadow DOM und dem regulären DOM blubbern kann oder nicht.
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. Es ist möglich, dass dies unterwegs durch Retargeting geändert wurde.
Event.defaultPrevented Schreibgeschützt: Gibt an, ob der Aufruf von event.preventDefault() das Ereignis abgebrochen hat oder nicht.
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 durch den Browser initiiert wurde (nach einem Benutzerklick, zum Beispiel) oder durch ein Skript (mittels einer Ereigniserstellungsmethode, zum Beispiel).
Event.srcElement Schreibgeschützt Veraltet: 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: 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 statt dessen 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 historischer Alias für Event.stopPropagation(), der stattdessen verwendet werden sollte. Wenn sein Wert vor der Rückgabe von einem Ereignis-Handler auf true gesetzt wird, verhindert es die Weiterverbreitung des Ereignisses.
Event.explicitOriginalTarget Nicht standardisiert Schreibgeschützt: Das explizite Originalziel des Ereignisses.
Event.originalTarget Nicht standardisiert Schreibgeschützt: Das ursprüngliche Ziel des Ereignisses, bevor jegliche Retargetings stattfanden.
Event.returnValue Veraltet: Eine historische Eigenschaft, die weiterhin unterstützt wird, um sicherzustellen, dass bestehende Websites weiterhin funktionieren. Verwenden Sie stattdessen Event.preventDefault() und Event.defaultPrevented.
Event.scoped Schreibgeschützt Veraltet: Ein boolescher Wert, der angibt, ob das gegebene Ereignis durch die Schattenwurzel in das Standard-DOM blubbern wird. Verwenden Sie stattdessen composed.

Instanzmethoden

Event.composedPath(): Gibt den Pfad des Ereignisses zurück (ein Array von Objekten, an 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(): Hebt das Ereignis auf (wenn es möglich ist, es rückgängig zu machen).
Event.stopImmediatePropagation(): Verhindert für dieses spezielle Ereignis, dass alle anderen Listener aufgerufen werden. Dies schließt Listener ein, die am selben Element angehängt sind sowie diejenigen, die an Elementen 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 versendet wurde, tut diese Methode nichts. Verwenden Sie stattdessen den Konstruktor (Event()).

Spezifikationen

Specification
DOM # interface-event

Browser-Kompatibilität

Siehe auch

Help improve MDN

Learn how to contribute Diese Seite wurde automatisch aus dem Englischen übersetzt.

Übersetzung auf GitHub anzeigen • Fehler mit dieser Übersetzung melden