Window: pagehide-Event

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Das pagehide-Ereignis wird an ein Window gesendet, wenn der Browser die aktuelle Seite ausblendet, um eine andere Seite aus dem Sitzungsverlauf anzuzeigen.

Zum Beispiel erhält die aktuelle Seite ein pagehide-Ereignis, bevor die vorherige Seite angezeigt wird, wenn der Benutzer auf die Zurück-Schaltfläche des Browsers klickt.

Syntax

Verwenden Sie den Ereignisnamen in Methoden wie addEventListener(), oder setzen Sie eine Ereignishandler-Eigenschaft.

js
addEventListener("pagehide", (event) => {});
onpagehide = (event) => {};

Ereignistyp

Ereigniseigenschaften

PageTransitionEvent.persisted Schreibgeschützt

Gibt an, ob das Dokument aus einem Cache geladen wird.

Ereignishandler-Aliase

Neben der Window-Schnittstelle ist die Ereignishandler-Eigenschaft onpagehide auch auf folgenden Zielen verfügbar:

Nutzungsnotizen

Ähnlich wie die Ereignisse unload und beforeunload wird dieses Ereignis von Browsern, insbesondere auf Mobilgeräten, nicht zuverlässig ausgelöst. Zum Beispiel wird das pagehide-Ereignis in folgendem Szenario überhaupt nicht ausgelöst:

  1. Ein mobiler Benutzer besucht Ihre Seite.
  2. Der Benutzer wechselt dann zu einer anderen App.
  3. Später schließt der Benutzer den Browser über den App-Manager.

Im Gegensatz zu den Ereignissen unload und beforeunload ist dieses Ereignis jedoch mit dem Back/Forward Cache (bfcache) kompatibel, sodass das Hinzufügen eines Listeners zu diesem Ereignis nicht verhindert, dass die Seite in den bfcache aufgenommen wird.

Das beste Ereignis zur Signalisierung des Endes einer Benutzersitzung ist das visibilitychange-Ereignis. In Browsern, die visibilitychange nicht unterstützen, ist das pagehide-Ereignis die zweitbeste Alternative.

Wenn Sie speziell versuchen, das Ausblenden von Seitenereignissen zu erkennen, ist das pagehide-Ereignis die beste Option.

Weitere Informationen darüber, wie dieses Ereignis mit anderen Ereignissen im Seitenlebenszyklus zusammenhängt, finden Sie im Page Lifecycle API Leitfaden.

Beispiele

In diesem Beispiel wird ein Ereignishandler eingerichtet, um auf pagehide-Ereignisse zu achten und eine spezielle Behandlung durchzuführen, wenn die Seite für eine mögliche Wiederverwendung gespeichert wird.

js
window.addEventListener(
  "pagehide",
  (event) => {
    if (event.persisted) {
      /* the page isn't being discarded, so it can be reused later */
    }
  },
  false,
);

Dies kann auch unter Verwendung der onpagehide-Ereignishandler-Eigenschaft auf dem Window geschrieben werden:

js
window.onpagehide = (event) => {
  if (event.persisted) {
    /* the page isn't being discarded, so it can be reused later */
  }
};

Spezifikationen

Specification
HTML Standard
# event-pagehide

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch

  • Das pageshow-Ereignis.
  • Page Lifecycle API bietet Best-Practice-Richtlinien zur Handhabung des Seitenlebenszyklusverhaltens in Ihren Webanwendungen.
  • PageLifecycle.js: Eine JavaScript-Bibliothek, die sich mit plattformübergreifenden Inkonsistenzen im Seitenlebenszyklusverhalten befasst.
  • Back/forward cache erklärt, was der Back/Forward Cache ist und welche Auswirkungen er auf verschiedene Seitenlebenszyklusereignisse hat.