KeyboardEvent Objekte beschreiben eine Benutzerinteraktion mit dem Keyboard. Jedes Event beschreibt eine Taste. Der Eventtyp (keydown, keypress, oder keyup) identifiziert welche Art von Aktivität ausgeführt wurde.
KeyboardEvent deutet nur an was mit einer Taste passiert. Wenn Sie Texteingaben behandeln müssen, verwenden sie stattdessen das HTML5 input Event. Beispiel: Wenn ein Benutzer Text über ein Handschriftsystem - wie auf einem Tablet - eingibt, werden Tastenevents möglicherweise nicht ausgelöst.KeyboardEvent Objekt.Diese Schnittstelle erbt auch Methoden seiner Eltern {{domxref("UIEvent")}} und {{domxref("Event")}}.
KeyboardEvent Objekt. Dies wurde nur durch Gecko implementiert (andere verwendeten {{domxref("KeyboardEvent.initKeyboardEvent()")}}) und sollte nicht mehr benutzt werden. Der moderne Standardweg ist, den {{domxref("KeyboardEvent.KeyboardEvent", "KeyboardEvent()")}} Konstrutor zu verwenden.KeyboardEvent Objekt. Dies wurde nie von Gecko implementiert (da stattdessen {{domxref("KeyboardEvent.initKeyEvent()")}} verwendet wurde) und sollte nicht mehr benutzt werden. Der moderne Standardweg ist, den {{domxref("KeyboardEvent.KeyboardEvent", "KeyboardEvent()")}} Konstruktor zu verwenden.Diese Schnittstelle erbt auch Methoden seiner Eltern {{domxref("UIEvent")}} und {{domxref("Event")}}.
true ist falls die Alt ( Option oder ⌥ unter OS X) Taste aktiv war, als das Tastenevent erzeugt wurde.keypress Event verwendet. Für Tasten deren char Attribut mehrere Zeichen enthält ist der Wert dieses Attributs der Unicode-Wert des ersten Zeichens . In Firefox 26 liefert dies Codes für druckbare Zeichen.
true ist, falls die Ctrl Taste aktiv war als das Key-Event erzeugt wurde.true ist falls das Event nach compositionstart und vor compositionend ausgelöst wird.true ist, falls die Meta Taste (auf Mac-Tastaturen, die ⌘ Command Taste; auf Windows-Tastaturen, die Windows -Taste (⊞)) aktiv war, als das Key-Event erzeugt wurde.true ist, falls die Taste gedrückt gehalten wird, so dass sie sich automatisch wiederholt.true ist, falls die Shift Taste aktiv war, als das Key-Event erzeugt wurde.keyCode.
Es gibt keydown, keypress, and keyup Events. Für die meisten Tasten versendet Gecko eine Sequenz von Key-Events wie folgt:
keydown Event gesendet.keypress Event gesendet.keyup Event gesendet.Einige Taste schalten den Status einer Kontrollleuchte um; dazu gehören Caps Lock, Num Lock, und Scroll Lock. Unter Windows und Linux senden diese Tasten nur keydown and keyup Events.
Unter Linux versendet Firefox 12 und eher das keypress Event auch für diese Tasten.
Jedoch sorgen die Einschränkungen des Mac OS X Event-Modells dafür, dass Caps Lock nur das keydown Event versendet. Num Lock wurde auf einigen älteren Laptop-Modellen (Modelle 2007 und älter) unterstützt, aber seitdem hat Mac OS X Num Lock nicht mehr untertstützt - nicht einmal auf externen Tastaturen. Auf älteren MacBooks mit einer Num Lock Taste, erzeugt diese Taste überhaupt keine KeyEvents. Gecko unterstützt die Scroll Lock Taste, falls eine externe Tastatur, die eine F14 Taste besitzt, angeschlossen ist. In bestimmten älteren Firefox-Versionen erzeugt diese Taste ein keypress Event; dieses inkonsistente Verhalten war {{bug(602812)}}.
Wenn eine Taste gedrückt und gehalten wird, beginnt sie die automatische Wiederholung (sog. auto-repeat). Das Resultat ist das Versenden einer Reihe von Events ähnlich der folgenden:
keydownkeypresskeydownkeypresskeyupDas sollte laut DOM Level 3 Spezifikation passieren. Allerdings gibt es einige Ausnahmen, wie unten beschrieben.
In einigen GTK-basierten Umgebungen versendet auto-repeat automatisch ein natives Key-Up Event während der automatischen Wiederholung und es ist für Gecko deshalb nicht möglich zwischen wiederholten Tastendrücken und einem auto-repeat unterscheiden zu können. Auf diesen Platformen wird eine Auto-Repeat Taste also die folgende Reihe von Events erzeugen:
keydownkeypresskeyupkeydownkeypresskeyupkeyupInnerhalb dieser Umgebungen gibt es leider keine Möglichkeit für Webinhalte den Unterschied zwischen selbst-wiederholenden Tasten und Tasten die wiederholt gedrückt werden herauszufinden.
Vor Gecko 5.0 {{geckoRelease('5.0')}} war platformübergreifendes Tastatur-Handling weniger einheitlich.
Anmerkung: manuelles Auslösen eines Events erzeugt nicht die mit dem Event verbundene Standard-Aktion. Zum Beispiel: manuelles Auslösen eines KeyEvent führt nicht dazu, dass der Buchstabe in einem fokussierten Eingabefeld auftaucht. Im Fall von UI-Events ist dies aus Sicherheitsgründen wichtig, da es verhindert, dass Skripte Benutzeraktionen simulieren, die mit dem Browser selbst interagieren.
<!DOCTYPE html>
<html>
<head>
<script>
'use strict';
document.addEventListener('keydown', (event) => {
const keyName = event.key;
if (keyName === 'Control') {
// not alert when only Control key is pressed.
return;
}
if (event.ctrlKey) {
// Even though event.key is not 'Control' (i.e. 'a' is pressed),
// event.ctrlKey may be true if Ctrl key is pressed at the time.
alert(`Combination of ctrlKey + ${keyName}`);
} else {
alert(`Key pressed ${keyName}`);
}
}, false);
document.addEventListener('keyup', (event) => {
const keyName = event.key;
// As the user release the Ctrl key, the key is no longer active.
// So event.ctrlKey is false.
if (keyName === 'Control') {
alert('Control key was released');
}
}, false);
</script>
</head>
<body>
</body>
</html>
| Specification | Status | Comment |
|---|---|---|
| {{SpecName('DOM3 Events', '#interface-keyboardevent', 'KeyboardEvent')}} | {{Spec2('DOM3 Events')}} | Initiale Definition |
Die KeyboardEvent Schnittstelle lief durch eine Vielzahl von Entwurfsversionen, erst unter DOM Events Level 2, wo sie verworfen wurde als kein Konsens entstand, danach unter DOM Events Level 3. Dies führte zu einer Implementation von nicht standardisierten Initialisationsmethoden, der frühen DOM Events Level 2 Version {{domxref("KeyboardEvent.initKeyEvent()")}} durch Gecko Browser und die frühe DOM Events Level 3 Version, {{domxref("KeyboardEvent.initKeyboardEvent()")}} durch Andere. Beide wurden durch den modernen Einsatz eines Konstruktors ersetzt: {{domxref("KeyboardEvent.KeyboardEvent", "KeyboardEvent()")}}.
{{CompatibilityTable}}
| Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|---|
| Basic support | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} |
| constructor | {{CompatVersionUnknown}} | {{CompatUnknown}} | {{CompatGeckoDesktop("31.0")}} | {{CompatNo}} | {{CompatVersionUnknown}} | {{CompatUnknown}} |
.char |
{{CompatNo}} | {{CompatUnknown}} | {{CompatNo}} | 9 | {{CompatNo}} | {{CompatNo}} |
.charCode |
{{CompatVersionUnknown}} | {{CompatUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} |
.isComposing |
{{CompatNo}} | {{CompatUnknown}} | {{CompatGeckoDesktop("31.0")}} | {{CompatNo}} | {{CompatNo}} | {{CompatNo}} |
.keyCode |
{{CompatVersionUnknown}} | {{CompatUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} |
.locale |
{{CompatNo}} | {{CompatUnknown}} | {{CompatNo}} | {{CompatVersionUnknown}} | {{CompatNo}} | {{CompatNo}} |
.location |
{{CompatVersionUnknown}} | {{CompatUnknown}} | {{CompatGeckoDesktop("15.0")}} | {{CompatVersionUnknown}} | {{CompatNo}} | {{CompatNo}} |
.repeat |
{{CompatVersionUnknown}} | {{CompatUnknown}} | {{CompatGeckoDesktop("28.0")}} | {{CompatVersionUnknown}} | {{CompatNo}} | {{CompatNo}} |
.which |
{{CompatVersionUnknown}} | {{CompatUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} |
.initKeyboardEvent() |
{{CompatVersionUnknown}}[1] | {{CompatUnknown}} | {{CompatNo}}[2] | {{CompatIE("9.0")}}[3] | {{CompatUnknown}} | {{CompatVersionUnknown}}[1] |
| Feature | Android | Edge | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|
| Basic support | {{CompatUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
| constructor | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatGeckoMobile("31.0")}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
.char |
{{CompatUnknown}} | {{CompatUnknown}} | {{CompatNo}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
.charCode |
{{CompatUnknown}} | {{CompatUnknown}} | {{CompatVersionUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
.isComposing |
{{CompatNo}} | {{CompatUnknown}} | {{CompatGeckoMobile("31.0")}} | {{CompatNo}} | {{CompatNo}} | {{CompatNo}} |
.keyCode |
{{CompatUnknown}} | {{CompatUnknown}} | {{CompatVersionUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
.locale |
{{CompatUnknown}} | {{CompatUnknown}} | {{CompatNo}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
.location |
{{CompatUnknown}} | {{CompatUnknown}} | {{CompatGeckoMobile("15.0")}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
.repeat |
{{CompatUnknown}} | {{CompatUnknown}} | {{CompatGeckoMobile("28.0")}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
.which |
{{CompatUnknown}} | {{CompatUnknown}} | {{CompatVersionUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
.initKeyboardEvent() |
{{CompatUnknown}} | {{CompatUnknown}} | {{CompatNo}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
[1] Die Argumente von initKeyboardEvent() von WebKit and Blink weichen von der Definition in DOM Level 3 Events ab. Die Methode ist: initKeyboardEvent(in DOMString typeArg, in boolean canBubbleArg, in boolean cancelableArg, in views::AbstractView viewArg, in DOMString keyIdentifierArg, in number locationArg, in boolean ctrlKeyArg, in boolean altKeyArg, in boolean shiftKeyArg, in boolean metaKeyArg, in boolean altGraphKeyArg)
[2] Gecko wird initKeyboardEvent() nicht unterstützen, weil es die Feature-Erkennung von Web-Apllikationen komplett zerstört. Siehe {{Bug(999645)}}.
[3] Das Argument von initKeyboardEvent() von IE weicht von der Definition in DOM Level 3 Events ab. Die Methode ist: initKeyboardEvent(in DOMString typeArg, in boolean canBubbleArg, in boolean cancelableArg, in views::AbstractView viewArg, in DOMString keyArg, in number locationArg, in DOMString modifierListArg, in boolean repeatArt, in DOMString locationArg). Siehe document of initKeyboardEvent() in MSDN.