JavaScript-Ereignisse

HTML-Ereignisse sind Ereignisse, die auf HTML-Elementen passieren.

Wenn JavaScript in einer HTML-Seite verwendet wird, kann JavaScript diese Ereignisse "verarbeiten".

HTML-Ereignis

HTML-Ereignisse können etwas sein, das ein Browser oder ein Benutzer tut.

Nachfolgend sind einige Beispiele für HTML-Ereignisse aufgeführt:

  • Eine HTML-Seite wird vollständig geladen
  • Ein HTML-Eingabefeld wird geändert
  • Ein HTML-Knopf wird geklickt

Normalerweise möchten Benutzer etwas tun, wenn ein Ereignis passiert.

JavaScript ermöglicht es Ihnen, Code auszuführen, wenn Ereignisse erkannt werden.

Durch JavaScript-Code，HTML ermöglicht es Ihnen, Ereignisbehandler zu HTML-Elementen hinzuzufügen.

Verwenden Sie Anführungszeichen:

<element event='einige JavaScript>

Verwenden Sie Anführungszeichen:

<element event="einige JavaScript">

In den folgenden Beispielen,onclick Eigenschaften (sowie Code) wurden hinzugefügt zu <button> Element:

Beispiel

<button onclick='document.getElementById("demo").innerHTML=Date()'>Was ist die aktuelle Zeit?</button>

Probieren Sie es selbst aus

In den obigen Beispielen hat der JavaScript-Code den Inhalt des Elements mit id="demo" geändert.

In den folgenden Beispielen, Code (verwendet this.innerHTML）hat den Inhalt seines eigenen Elements geändert:

Beispiel

<button onclick="this.innerHTML=Date()">Was ist die aktuelle Zeit?</button>

Probieren Sie es selbst aus

JavaScript-Code besteht oft aus mehreren Zeilen. Es ist häufiger, Funktionen durch Ereignisattribute aufzurufen:

Beispiel

<button onclick="displayDate()">Was ist die aktuelle Zeit?</button>

Probieren Sie es selbst aus

Häufige HTML-Ereignisse

Nachfolgend sind einige häufige HTML-Ereignisse aufgeführt:

Ereignis Beschreibung
onchange Das HTML-Element wurde geändert
onclick Der Benutzer klickt auf ein HTML-Element
onmouseover Der Benutzer bewegt den Mauszeiger auf ein HTML-Element
onmouseout Der Benutzer bewegt den Mauszeiger von einem HTML-Element weg
onkeydown Der Benutzer drückt eine Taste auf der Tastatur
onload Der Browser hat die Seitenladung abgeschlossen

Eine umfassendere Liste:CodeW3C.com JavaScript-Referenzhandbuch HTML-DOM-Ereignisse.

Was kann JavaScript tun?

Ereignisbehandler können zur Verarbeitung, Überprüfung von Benutzerinput, Benutzeraktionen und Browseraktionen verwendet werden:

  • Was immer geschieht, wenn die Seite geladen wird
  • Was zu tun ist, wenn die Seite geschlossen wird
  • Aktionen, die bei dem Klicken auf einen Button ausgeführt werden sollten
  • Inhalte, die bei der Eingabe von Daten überprüft werden sollten
  • und so weiter

Es gibt viele verschiedene Methoden, wie JavaScript Ereignisse verarbeiten kann:

  • HTML-Ereignisattribute können JavaScript-Code ausführen.
  • HTML-Ereignisattribute können JavaScript-Funktionen aufrufen.
  • Sie können eigenen Ereignisbehandlungsfunctionen HTML-Elementen zuweisen.
  • Sie können verhindern, dass Ereignisse gesendet oder bearbeitet werden.
  • und so weiter

Sie werden im Kapitel HTML-DOM mehr über Ereignisse und Ereignisbehandlungen lernen.