Eigene Events in JavaScript

Veröffentlicht von am

unter JavaScript, HLI und Browser

Heute habe ich gelernt, dass man in JavaScript sehr einfach eigene Events auslösen kann. Funktioniert so nur im DOM, ist aber sehr praktisch, zum Beispiel um einfach Daten zwischen voneinander unanhängigen Skripten auszutauschen.

In über das event.detail Objekt kann man beliebige Daten verschicken.

const event = new CustomEvent("my-custom-event", {
  detail: { data: { hello: "world" } },
});

document.dispatchEvent(event);

// Elsewhere in the code, or maybe even in a separate script:

document.addEventListener("my-custom-event", (event) => {
  console.log("a thing happened", event.detail);
});

Eine simple Demo (mit einem mehr oder weniger praktischen Beispiel):

JavaScript Custom Event Beispiel

Hinterlasse einen Kommentar

Verfügbare Formatierungen

Benutze Markdown-Befehle oder ihre HTML-Äquivalente, um deinen Kommentar zu formatieren:

Textauszeichnungen
*kursiv*, **fett**, ~~durchgestrichen~~, `Code` und <mark>markierter Text</mark>.
Listen
- Listenpunkt 1
- Listenpunkt 1
1. Nummerierte Liste 1
2. Nummerierte Liste 2
Zitate
> Zitierter Text
Code-Blöcke
```
// Ein einfacher Code-Block
```
```php
// Etwas PHP-Code
phpinfo();
```
Verlinkungen
[Link-Text](https://example.com)
Vollständige URLs werden automatisch in Links umgewandelt.

Auf der eigenen Website geantwortet? Sende eine Webmention!