Element: keydown-Event

Verwenden Sie den Event-Namen in Methoden wie addEventListener() oder setzen Sie eine Event-Handler-Eigenschaft.

addEventListener("keydown", (event) => {});

onkeydown = (event) => {};

Ein KeyboardEvent. Erbt von UIEvent und Event.

Diese Schnittstelle erbt auch Eigenschaften ihrer Eltern, UIEvent und Event.

KeyboardEvent.altKey Schreibgeschützt

Gibt einen booleschen Wert zurück, der true ist, wenn die Alt-Taste (Option oder ⌥ auf macOS) aktiv war, als das Tasten-Event ausgelöst wurde.

KeyboardEvent.code Schreibgeschützt

Gibt einen String mit dem Code-Wert der physikalischen Taste zurück, die durch das Event repräsentiert wird.

Warnung: Dies ignoriert das Tastaturlayout des Benutzers, sodass, wenn der Benutzer die Taste an der "Y"-Position in einem QWERTY-Tastaturlayout drückt (nahe der Mitte der Reihe über der Home-Reihe), dies immer "KeyY" zurückgeben wird, selbst wenn der Benutzer eine QWERTZ-Tastatur hat (was bedeuten würde, der Benutzer erwartet ein "Z" und alle anderen Eigenschaften würden ein "Z" anzeigen) oder ein Dvorak-Tastaturlayout (wo der Benutzer ein "F" erwarten würde). Wenn Sie die korrekten Tastenanschläge dem Benutzer anzeigen möchten, können Sie Keyboard.getLayoutMap() verwenden.

KeyboardEvent.ctrlKey Schreibgeschützt

Gibt einen booleschen Wert zurück, der true ist, wenn die Ctrl-Taste aktiv war, als das Tasten-Event ausgelöst wurde.

KeyboardEvent.isComposing Schreibgeschützt

Gibt einen booleschen Wert zurück, der true ist, wenn das Event zwischen compositionstart und compositionend ausgelöst wird.

KeyboardEvent.key Schreibgeschützt

Gibt einen String zurück, der den Tastenwert der Taste repräsentiert, die durch das Event repräsentiert wird.

KeyboardEvent.location Schreibgeschützt

Gibt eine Zahl zurück, die den Ort der Taste auf der Tastatur oder einem anderen Eingabegerät darstellt. Eine Liste der Konstanten, die die Orte identifizieren, ist in Tastaturorte gezeigt.

KeyboardEvent.metaKey Schreibgeschützt

Gibt einen booleschen Wert zurück, der true ist, wenn die Meta-Taste (auf Mac-Tastaturen die ⌘ Command-Taste; auf Windows-Tastaturen die Windows-Taste (⊞)) aktiv war, als das Tasten-Event ausgelöst wurde.

KeyboardEvent.repeat Schreibgeschützt

Gibt einen booleschen Wert zurück, der true ist, wenn die Taste so gehalten wird, dass sie automatisch wiederholt wird.

KeyboardEvent.shiftKey Schreibgeschützt

Gibt einen booleschen Wert zurück, der true ist, wenn die Shift-Taste aktiv war, als das Tasten-Event ausgelöst wurde.

Dieses Beispiel protokolliert den KeyboardEvent.code-Wert, wann immer Sie eine Taste innerhalb des <input>-Elements drücken.

<input placeholder="Click here, then press down a key." size="40" />
<p id="log"></p>

const input = document.querySelector("input");
const log = document.getElementById("log");

input.addEventListener("keydown", logKey);

function logKey(e) {
  log.textContent += ` ${e.code}`;
}

Seit Firefox 65 werden die keydown- und keyup-Events während der Komposition mit dem Eingabemethoden-Editor ausgelöst, um die Kompatibilität zwischen Browsern für CJKT-Benutzer zu verbessern (Firefox bug 354358). Um alle keydown-Events zu ignorieren, die Teil der Komposition sind, machen Sie etwas wie dies (229 ist ein spezieller Wert, der für einen keyCode gesetzt wird, der sich auf ein Event bezieht, das von einem IME verarbeitet wurde):

eventTarget.addEventListener("keydown", (event) => {
  if (event.isComposing || event.keyCode === 229) {
    return;
  }
  // do something
});

Nota: compositionstart kann nach keydown ausgelöst werden, wenn Sie das erste Zeichen tippen, das das IME öffnet, und compositionend kann vor keydown ausgelöst werden, wenn Sie das letzte Zeichen tippen, das das IME schließt. In diesen Fällen ist isComposing falsch, auch wenn das Event Teil der Komposition ist. Allerdings ist KeyboardEvent.keyCode in diesen Fällen immer noch 229, daher ist es weiterhin ratsam, auch keyCode zu überprüfen, obwohl es veraltet ist.

• input
• keypress
• keyup