Daspagehide-Ereignis wird an einWindow gesendet, wenn der Browser die aktuelle Seite ausblendet, um eine andere Seite aus dem Sitzungsverlauf darzustellen.

Zum Beispiel, wenn der Benutzer die Zurück-Taste des Browsers klickt, erhält die aktuelle Seite einpagehide-Ereignis, bevor die vorherige Seite angezeigt wird.

Syntax

Verwenden Sie den Ereignisnamen in Methoden wieaddEventListener() oder setzen Sie eine Ereignis-Handler-Eigenschaft.

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

Ereignistyp

EinPageTransitionEvent, das vonEvent erbt.

Ereigniseigenschaften

PageTransitionEvent.persistedSchreibgeschützt

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

Ereignis-Handler-Aliasse

Zusätzlich zurWindow-Schnittstelle ist die Ereignis-Handler-Eigenschaftonpagehide auch bei den folgenden Zielen verfügbar:

• HTMLBodyElement
• HTMLFrameSetElement
• SVGSVGElement

Hinweise zur Verwendung

Wie dieunload undbeforeunload Ereignisse wird dieses Ereignis von Browsern, insbesondere auf Mobilgeräten, nicht zuverlässig ausgelöst. Zum Beispiel wird daspagehide-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.

Jedoch, im Gegensatz zu denunload- undbeforeunload-Ereignissen, ist dieses Ereignis kompatibel mit demBack/Forward-Cache (bfcache), sodass das Hinzufügen eines Listeners zu diesem Ereignis nicht verhindert, dass die Seite in den bfcache aufgenommen wird.

Das beste Ereignis, um das Ende einer Benutzersitzung zu signalisieren, ist dasvisibilitychange Ereignis. In Browsern, dievisibilitychange nicht unterstützen, ist daspagehide-Ereignis die beste Alternative.

Wenn Sie speziell versuchen, Seiten-Entlade-Ereignisse zu erkennen, ist daspagehide-Ereignis die beste Option.

Sehen Sie sich dasPage Lifecycle API an, um mehr darüber zu erfahren, wie dieses Ereignis mit anderen Ereignissen im Seitenlebenszyklus zusammenhängt.

Beispiele

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

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

Dies kann auch unter Verwendung deronpagehide-Ereignis-Handler-Eigenschaft auf demWindow geschrieben werden:

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

Spezifikationen

Browser-Kompatibilität

Siehe auch

• Daspageshow Ereignis.
• DasPage Lifecycle API gibt Best Practices für die Handhabung des Seitenlebenszyklus in Ihren Webanwendungen.
• PageLifecycle.js: eine JavaScript-Bibliothek, die sich mit browserübergreifenden Inkonsistenzen im Seitenlebenszyklusverhalten befasst.
• Back/forward cache erklärt, was der Back/Forward-Cache ist und seine Auswirkungen auf verschiedene Seitenlebenszyklusereignisse.