So erkennst du Pfeil nach oben
document.addEventListener('keydown', (event) => {
if (event.key === "ArrowUp") {
// Arrow Up was pressed
}
});Verwende event.key, um auf die Bedeutung der Taste zu reagieren (sie folgt dem Tastaturlayout), und event.code für ihre physische Position, zum Beispiel WASD in Spielen. keyCode und which sind veraltet: Sie funktionieren noch, aber ihre Werte unterscheiden sich je nach Browser und Layout.
So verhalten sich Browser bei Pfeil nach oben
Pfeiltasten scrollen die Seite und bewegen die Schreibmarke. In eigenen Listboxen, Menüs und Grids solltest du sie behandeln, um den Fokus zwischen den Elementen zu verschieben – und preventDefault() aufrufen, damit die Seite gleichzeitig nicht scrollt.
In React
<input onKeyDown={(e) => { if (e.key === "ArrowUp") { /* … */ } }} />JavaScript Keycode Finder
Drück eine beliebige Taste und sieh sofort alle Eigenschaften des Keyboard-Events, dazu ein kopierfertiges keydown-Snippet für Shortcuts.
Häufige Fragen
Was ist der keyCode für Pfeil nach oben?
38. Er ist aber veraltet: Verwende in neuem Code event.key („ArrowUp“) oder event.code (ArrowUp).
Was ist der Unterschied zwischen event.key und event.code?
event.key ist das Zeichen oder die Aktion, die die Taste mit dem aktuellen Layout auslöst; event.code ist die physische Tastenposition und auf jedem Layout gleich.
Sollte ich keydown oder keypress verwenden?
keydown. Das keypress-Ereignis ist veraltet und wird nicht für Tasten ausgelöst, die keine Zeichen erzeugen, etwa Escape oder die Pfeiltasten.