KeyboardEvent.keyIdentifier — Eigenschaft · JavaScript-Referenz

Signatur

KeyboardEvent.keyIdentifier

Beschreibung

KeyboardEvent.keyIdentifier stammt aus einem frühen Entwurf der DOM-Level-3-Events-Spezifikation. Die Eigenschaft liefert einen String, der die gedrückte Taste beschreibt. Für Funktions- und Steuertasten ist das ein Name wie "Enter", "Left", "Up", "Shift" oder "F1". Für Zeichentasten ist es ein Unicode-Codepunkt im Format "U+XXXX", z. B. "U+0041" für die Taste „A“.

Die Eigenschaft wurde nie endgültig standardisiert. Ersetzt wurde sie durch KeyboardEvent.key (logischer Tastenwert, abhängig vom Tastaturlayout) und KeyboardEvent.code (physische Tastenposition). Chrome hat keyIdentifier mit Version 54 entfernt, Firefox hat es nie umgesetzt.

In neuem Code solltest du keyIdentifier nicht verwenden. Wichtig ist es nur noch, wenn du Altcode pflegst oder sehr alte WebKit-Umgebungen unterstützen musst. Dann sollte es ausschließlich als Rückfallebene nach einer Funktionsprüfung auf key dienen.

Rückgabewert

Typ

string | undefined

Beschreibung

Ein Tastenbezeichner wie "Enter", "Down", "U+0020" (Leertaste) oder "Unidentified". In Browsern ohne Unterstützung ist der Wert undefined.

Beispiele

Funktionsprüfung mit Rückfall auf keyIdentifier

document.addEventListener('keydown', (event) => {
  // Moderner Standard zuerst, keyIdentifier nur als Rückfallebene
  const taste = event.key ?? event.keyIdentifier ?? 'Unidentified';
  console.log('Gedrückt:', taste);
});

Gedrückt: Enter

keyIdentifier in einen key-ähnlichen Wert umwandeln

const ALT_ZU_KEY = {
  Left: 'ArrowLeft',
  Right: 'ArrowRight',
  Up: 'ArrowUp',
  Down: 'ArrowDown',
  'U+001B': 'Escape',
  'U+0008': 'Backspace',
  'U+007F': 'Delete',
  'U+0009': 'Tab'
};

const normalisiereTaste = (event) => {
  if (typeof event.key === 'string') return event.key;
  const id = event.keyIdentifier;
  if (!id) return 'Unidentified';
  if (ALT_ZU_KEY[id]) return ALT_ZU_KEY[id];
  // "U+0041" -> "A"
  if (id.startsWith('U+')) {
    return String.fromCodePoint(parseInt(id.slice(2), 16));
  }
  return id; // z. B. "Enter", "Shift", "F5"
};

document.addEventListener('keydown', (e) => console.log(normalisiereTaste(e)));

ArrowLeft

Migration: Pfeiltasten-Steuerung auf event.key umstellen

// Alt (veraltet, funktioniert in aktuellen Browsern nicht mehr):
// if (event.keyIdentifier === 'Left') bewegeLinks();

const bewegeLinks = () => console.log('← links');
const bewegeRechts = () => console.log('→ rechts');

document.addEventListener('keydown', (event) => {
  switch (event.key) {
    case 'ArrowLeft':
      bewegeLinks();
      break;
    case 'ArrowRight':
      bewegeRechts();
      break;
  }
});

← links

// Wichtig · Fallstricke

Veraltet und nicht standardisiert: Seit Chrome 54 ist die Eigenschaft entfernt, Firefox hat sie nie unterstützt. In aktuellen Browsern ist der Wert meist undefined. Verwende stattdessen event.key oder event.code.
Die Bezeichner weichen von key ab: Aus "Left" wird "ArrowLeft", aus "U+001B" wird "Escape". Einen einfachen 1:1-Ersatz per Suchen und Ersetzen gibt es daher nicht.
Für Buchstabentasten lieferte WebKit häufig den Codepunkt des Großbuchstabens ("U+0041"), auch ohne gedrückte Umschalttaste. Groß- und Kleinschreibung lässt sich darüber nicht zuverlässig erkennen.
Bei Tastaturlayouts, die nicht auf US-Englisch basieren, waren die Werte zwischen Browsern und Betriebssystemen uneinheitlich. Genau das war ein Hauptgrund für die Ablösung.
Prüfe immer zuerst mit typeof event.key === 'string', bevor du auf keyIdentifier zurückfällst.

Siehe auch

KeyboardEvent.key KeyboardEvent.code KeyboardEvent.keyCode KeyboardEvent KeyboardEvent.location