TouchEvent.altKey — Eigenschaft · JavaScript-Referenz

Signatur

TouchEvent.altKey

Beschreibung

Die schreibgeschützte Eigenschaft altKey des TouchEvent-Interfaces gibt true zurück, wenn die Alt-Taste (unter macOS die Option-Taste ⌥) in dem Moment gedrückt war, als das Touch-Event entstand. Andernfalls ist der Wert false.

Wirklich nützlich ist die Eigenschaft auf Geräten, die Touchscreen und Hardware-Tastatur kombinieren: Convertible-Laptops, Tablets mit angedockter Tastatur oder Touch-Monitore am Desktop. Damit lassen sich Touch-Gesten um Zusatzfunktionen erweitern, etwa „Alt + Tippen“ zum Duplizieren eines Elements oder „Alt + Ziehen“ für freies Verschieben ohne Einrasten.

Zusammen mit ctrlKey, shiftKey und metaKey bildet altKey die Gruppe der Modifikatortasten-Eigenschaften, die es genauso auch bei MouseEvent, KeyboardEvent und PointerEvent gibt. Da der Wert zum Zeitpunkt des Events festgehalten wird, eignet er sich gut für Entscheidungen direkt im Handler von touchstart, touchmove oder touchend.

Rückgabewert

Typ

boolean

Beschreibung

true, wenn die Alt-/Option-Taste beim Erzeugen des Events gedrückt war, sonst false.

Beispiele

Alt-Taste beim Antippen prüfen

const canvas = document.querySelector('#zeichenflaeche');

canvas.addEventListener('touchstart', (event) => {
  if (event.altKey) {
    console.log('Alt + Tippen: Radiergummi aktiv');
  } else {
    console.log('Normales Tippen: Stift aktiv');
  }
}, { passive: true });

Alt + Tippen: Radiergummi aktiv

Element mit Alt + Tippen duplizieren

const board = document.querySelector('#board');

board.addEventListener('touchend', (event) => {
  const karte = event.target.closest('.karte');
  if (!karte) return;

  if (event.altKey) {
    // Kopie direkt hinter dem Original einfügen
    const kopie = karte.cloneNode(true);
    karte.after(kopie);
    console.log('Karte dupliziert');
  } else {
    karte.classList.toggle('ausgewaehlt');
  }
});

Karte dupliziert

Alle Modifikatortasten auswerten

const modifikatoren = (event) => ({
  alt: event.altKey,
  ctrl: event.ctrlKey,
  shift: event.shiftKey,
  meta: event.metaKey
});

document.addEventListener('touchstart', (event) => {
  const aktiv = Object.entries(modifikatoren(event))
    .filter(([, gedrueckt]) => gedrueckt)
    .map(([name]) => name);
  console.log('Aktive Modifikatoren:', aktiv.join(', ') || 'keine');
}, { passive: true });

Aktive Modifikatoren: alt, shift

Synthetisches TouchEvent mit altKey erzeugen (z. B. für Tests)

const ziel = document.querySelector('#button');

ziel.addEventListener('touchstart', (e) => {
  console.log('altKey:', e.altKey);
});

const event = new TouchEvent('touchstart', {
  bubbles: true,
  cancelable: true,
  altKey: true
});
ziel.dispatchEvent(event);

altKey: true

// Wichtig · Fallstricke

Schreibgeschützt: Wenn man event.altKey = true zuweist, passiert nichts (im Strict Mode wird ein TypeError geworfen). Für synthetische Events setzt man den Wert über das Options-Objekt von new TouchEvent(type, { altKey: true }).
Nur mit Hardware-Tastatur sinnvoll: Auf reinen Smartphones ohne angeschlossene Tastatur ist der Wert praktisch immer false. Kernfunktionen sollten deshalb nie allein über altKey erreichbar sein.
Verfügbarkeit: TouchEvent gibt es nur in Umgebungen mit Touch-Unterstützung. Viele Desktop-Browser (z. B. Firefox und Safari am Desktop) stellen den Konstruktor nicht bereit, also vorher mit 'TouchEvent' in window prüfen. Für einheitliche Eingaben von Maus, Stift und Touch empfehlen sich PointerEvents, die ebenfalls altKey haben.
Kollision mit Systemkürzeln: Unter Windows öffnet ein einzelnes Drücken von Alt die Menüleiste, unter macOS erzeugt Option Sonderzeichen. Wird Alt in Kombination genutzt, gegebenenfalls preventDefault() beachten (nicht mit passive: true kombinierbar).
AltGr: Auf manchen Tastaturlayouts wird AltGr als Strg + Alt gemeldet, sodass altKey und ctrlKey gleichzeitig true sein können.

Siehe auch

TouchEvent TouchEvent.ctrlKey TouchEvent.shiftKey TouchEvent.metaKey MouseEvent.altKey KeyboardEvent.altKey PointerEvent