Element: keypress-Event

Verwenden Sie den Ereignisnamen in Methoden wie addEventListener(), oder legen Sie eine Ereignis-Handler-Eigenschaft fest.

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

onkeypress = (event) => {};

Ein KeyboardEvent. Erbt von UIEvent und Event.

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

KeyboardEvent.altKey Nur lesbar

Gibt einen Booleschen Wert zurück, der true ist, wenn die Alt-Taste (Option oder ⌥ auf macOS) aktiv war, als das Tastenereignis erzeugt wurde.

KeyboardEvent.code Nur lesbar

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

KeyboardEvent.ctrlKey Nur lesbar

Gibt einen Booleschen Wert zurück, der true ist, wenn die Ctrl-Taste aktiv war, als das Tastenereignis erzeugt wurde.

KeyboardEvent.isComposing Nur lesbar

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

KeyboardEvent.key Nur lesbar

Gibt einen String zurück, der den Tastenwert der durch das Ereignis repräsentierten Taste wiedergibt.

KeyboardEvent.location Nur lesbar

Gibt eine Zahl zurück, die die Position der Taste auf der Tastatur oder einem anderen Eingabegerät angibt. Eine Liste der Konstanten, die die Positionen identifizieren, ist in Tastaturpositionen dargestellt.

KeyboardEvent.metaKey Nur lesbar

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 Tastenereignis erzeugt wurde.

KeyboardEvent.repeat Nur lesbar

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

KeyboardEvent.shiftKey Nur lesbar

Gibt einen Booleschen Wert zurück, der true ist, wenn die Shift-Taste aktiv war, als das Tastenereignis erzeugt wurde.

Dieses Beispiel protokolliert den KeyboardEvent.code-Wert, wann immer Sie eine Taste drücken nachdem Sie das <input>-Element fokussiert haben.

<div>
  <label for="sample">Focus the input and type something:</label>
  <input type="text" name="text" id="sample" />
</div>
<p id="log"></p>

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

input.addEventListener("keypress", logKey);

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

• Die Document-Schnittstelle, die das Ereignis ebenfalls anvisiert.

• Verwandte Ereignisse:

  • input
  • keydown
  • keyup