JavaScript/DOM/Event/keyup

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche
Event-Handler JavaScript 1.2 DOM 3.0 keyup
Bedeutung 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
Elternelemente Darf vorkommen in: allen Elementen,
außer im head
Event-Objekt KeyboardEvent
Browsersupport
  • Chrome
  • Firefox
  • IE
  • Opera
  • Safari
Beispiel

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.

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>
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.

Tipp

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]

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

{{{siehe_auch}}}

Weblinks

{{{Weblinks}}}

Meine Werkzeuge
Namensräume

Varianten
Aktionen
Übersicht
Index
Mitmachen
Werkzeuge
Spenden
SELFHTML