JavaScript/DOM/Event/keyup

Aus SELFHTML-Wiki
< JavaScript‎ | DOM‎ | Event
Wechseln zu: Navigation, Suche

Der keyup-Event-Handler Der Eventhandler keyup wird bei losgelassener Taste ausgelöst. Tritt ein, wenn der Anwender eine Taste gedrückt hat und diese wieder loslässt.

bubbles

ja

cancelable

ja

mögliche Auslöser

allen Elementen,
außer im head

Event-Objekt

KeyboardEvent

Beispiel ansehen …
  <form name="Test" action="">
    <input type="text" size="30" name="Eingabe"
      onkeyup="this.form.Ausgabe.value = this.value"><br>
    <input type="text" readonly size="30" name="Ausgabe"><br>
    <input type="reset">
  </form>

Im Beispiel wird ein Formular definiert, das zwei Eingabefelder mit den Namen Eingabe und Ausgabe enthält. Wenn der Anwender in dem oberen Feld, also dem, das für die Eingabe gedacht ist, etwas eingibt, wird der Wert automatisch Zeichen für Zeichen in das untere, also das Ausgabefeld übernommen. Dazu ist im Eingabefeld der Event-Handler keyup notiert.

Dieser Event-Handler tritt in Aktion, wenn der Anwender in dem Feld eine Taste gedrückt und wieder losgelassen hat, was ja bei jedem eingegebenen Zeichen der Fall ist. Mit this.form.Ausgabe.value=this.value wird dem Ausgabefeld der aktuelle Wert des Eingabefeldes zugewiesen.

Beachten Sie: Auf Touch-Geräten kann es zu Problemen mit der Erfassung von Tastatur-Eingaben kommen, da das Drücken der Umschalt-Taste nicht erfasst wird und es so zu Problemen mit der Groß-/Kleinschreibung kommen kann.
Empfehlung: Die Event-Handler für Tastatureingaben waren lange in keinem Standard zu finden, da es in Unix-System abweichende Verhalten gab.[1]. Trotzdem konnten sie problemlos eingesetzt werden und sind mittlerweile im DOM3 spezifiziert.[2]


  1. developer.mozilla.org Auto-repeat_handling
  2. W3C: event-type-keydown