Start · Sprachen · JavaScript · Referenz · Window: gamepaddisconnected

Window: gamepaddisconnected

Ereignis

Wird am <code>window</code> ausgelöst, wenn der Browser erkennt, dass ein zuvor verbundenes Gamepad getrennt wurde.

seit JavaScript Baseline: alle modernen Browser (Chrome 21+, Firef Kategorie: webapi

Signatur

window.addEventListener("gamepaddisconnected", handler)

Beschreibung

Das Ereignis gamepaddisconnected gehört zur Gamepad API und wird am Window-Objekt ausgelöst, sobald ein Gamepad, das der Seite bekannt war, nicht mehr verfügbar ist. Das passiert zum Beispiel, wenn jemand den USB-Stecker zieht, der Bluetooth-Controller ausgeschaltet wird oder der Akku leer ist. Das Ereignisobjekt ist ein GamepadEvent. Seine Eigenschaft gamepad verweist auf das getrennte Gamepad-Objekt, bei dem connected nun false ist.

Typische Einsatzfälle sind: ein laufendes Spiel pausieren, einen Hinweis wie „Controller getrennt“ einblenden, den Spieler-Slot freigeben oder auf Tastatursteuerung umschalten. Über event.gamepad.index erkennt man, welcher Spieler bzw. welcher Slot betroffen ist.

Das Ereignis kann per addEventListener() oder über die Eigenschaft window.ongamepaddisconnected abonniert werden. Es wird nur für Gamepads ausgelöst, die der Seite vorher bekannt gemacht wurden. Das ist in der Regel erst der Fall, nachdem ein gamepadconnected-Ereignis ausgelöst wurde, also nachdem der Nutzer bei geöffneter Seite eine Taste gedrückt hat.

Das Ereignis ist nicht abbrechbar (cancelable: false) und wird nicht durch den DOM-Baum weitergereicht (kein Bubbling), da es direkt am window ausgelöst wird.

Parameter

Name Typ Default Beschreibung
$type Pflicht string Der Ereignisname "gamepaddisconnected".
$handler Pflicht (event: GamepadEvent) => void Callback, der ein GamepadEvent erhält. Über event.gamepad sind index, id, connected (jetzt false) und weitere Eigenschaften zugänglich.
$options boolean|AddEventListenerOptions false Optionale Listener-Optionen wie once, signal oder capture.

Beispiele

Trennung mit addEventListener erkennen

window.addEventListener('gamepaddisconnected', (event) => {
  const { index, id, connected } = event.gamepad;
  console.log(`Gamepad ${index} getrennt: ${id} (connected=${connected})`);
});
Gamepad 0 getrennt: Xbox 360 Controller (XInput STANDARD GAMEPAD) (connected=false)

Spiel pausieren und Spieler-Slot freigeben

const players = new Map();
let paused = false;

window.addEventListener('gamepadconnected', ({ gamepad }) => {
  players.set(gamepad.index, { id: gamepad.id });
  console.log(`Spieler ${gamepad.index + 1} beigetreten`);
});

window.addEventListener('gamepaddisconnected', ({ gamepad }) => {
  players.delete(gamepad.index);
  paused = true;
  console.log(`Spieler ${gamepad.index + 1} getrennt – Spiel pausiert`);
  if (players.size === 0) {
    console.log('Kein Controller mehr verbunden – Tastatursteuerung aktiv');
  }
});
Spieler 1 beigetreten Spieler 1 getrennt – Spiel pausiert Kein Controller mehr verbunden – Tastatursteuerung aktiv

Über die on-Property und Abmelden per AbortController

// Variante 1: on-Property (überschreibt einen vorherigen Handler)
window.ongamepaddisconnected = (event) => {
  console.log('Getrennt:', event.gamepad.id);
};

// Variante 2: Listener später sauber entfernen
const controller = new AbortController();
const onDisconnect = (e) => console.log('Slot frei:', e.gamepad.index);
window.addEventListener('gamepaddisconnected', onDisconnect, {
  signal: controller.signal
});

// z. B. beim Verlassen der Spielszene
const leaveScene = () => {
  controller.abort(); // entspricht removeEventListener
  window.ongamepaddisconnected = null;
};

// Wichtig · Fallstricke

  • Sicherer Kontext: Neuere Browser stellen die Gamepad API nur in sicheren Kontexten (HTTPS) bereit. Außerdem kann eine Permissions Policy (gamepad) sie in iframes sperren.
  • Nur bekannte Gamepads: Das Ereignis wird nur für Controller ausgelöst, die zuvor per gamepadconnected gemeldet wurden. Ein Controller, der nie „aktiviert“ wurde (keine Taste gedrückt), löst kein gamepaddisconnected aus.
  • Veraltete Referenzen: Halte keine alten Gamepad-Objekte fest. Chrome liefert bei navigator.getGamepads() Momentaufnahmen. Nach der Trennung steht an dieser Stelle im Array null. Prüfe in der Spielschleife daher immer auf null.
  • Index-Wiederverwendung: Ein neu verbundener Controller kann denselben index bekommen. Verlasse dich also nicht darauf, dass ein Index dauerhaft einer bestimmten Person gehört.
  • Kein Bubbling, nicht abbrechbar: Registriere den Listener direkt am window, nicht an Elementen.
  • Datenschutz: Die id kann Hersteller- und Produkt-IDs enthalten und sich damit für Fingerprinting eignen. Gib sie nicht unnötig weiter.
  • Ältere Safari-Versionen und Browser vor ca. 2017 unterstützen das Ereignis nicht zuverlässig. Als Rückfallebene kannst du in einer requestAnimationFrame-Schleife regelmäßig navigator.getGamepads() abfragen.