Window: pageshow-Ereignis
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since Juli 2015.
Das pageshow-Ereignis wird an ein Window gesendet, wenn der Browser zu einem neuen Dokument navigiert.
Dies schließt ein:
- Das anfängliche Laden der Seite.
- Navigation zur Seite von einer anderen Seite im selben Fenster oder Tab.
- Wiederherstellen einer eingefrorenen Seite auf mobilen Betriebssystemen.
- Zurückkehren zur Seite über die Vorwärts- oder Rückwärts-Schaltflächen des Browsers (einschließlich, wenn sie aus dem bfcache wiederhergestellt wird).
- Öffnen einer Seite in einem Hintergrundtab.
- Prerendering einer Seite, selbst bevor sie aktiviert wird.
Warnung:
Trotz des Namens wird das pageshow-Ereignis nicht ausgelöst, wenn die Seite tatsächlich dem Benutzer angezeigt wird. Zum Beispiel kann sie in einem Hintergrundtab geöffnet oder prerendered werden. Wenn Sie daran interessiert sind, auf die Anzeige der Seite für den Benutzer zu reagieren, verwenden Sie die folgenden Ereignisse:
pagereveal: Wird gesendet, wenn eine Seite erstmals gerendert wird.visibilitychange: Wird gesendet, wenn sich die Sichtbarkeit einer Seite ändert.prerenderingchange: Wird gesendet, wenn eine prerendered Seite aktiviert wird.
Hinweis:
Während der anfänglichen Seitennutzung wird das pageshow-Ereignis nach dem load-Ereignis ausgelöst.
Syntax
Verwenden Sie den Ereignisnamen in Methoden wie addEventListener() oder setzen Sie eine Ereignishandler-Eigenschaft.
addEventListener("pageshow", (event) => { })
onpageshow = (event) => { }
Ereignistyp
Ein PageTransitionEvent. Erbt von Event.
Ereigniseigenschaften
PageTransitionEvent.persistedSchreibgeschützt-
Gibt an, ob das Dokument aus einem Cache geladen wird.
Ereignishandler-Aliase
Zusätzlich zur Window-Schnittstelle ist die Ereignishandler-Eigenschaft onpageshow auch auf den folgenden Zielen verfügbar:
Beispiele
Dieses Beispiel richtet Ereignishandler für die im Array events aufgeführten Ereignisse ein. Der Handler eventLogger() protokolliert den Typ des Ereignisses, das aufgetreten ist, in der Konsole und schließt den Wert des persisted-Flags bei pageshow- und pagehide-Ereignissen ein.
JavaScript
const events = ["pagehide", "pageshow", "unload", "load"];
const eventLogger = (event) => {
switch (event.type) {
case "pagehide":
case "pageshow": {
let isPersisted = event.persisted ? "persisted" : "not persisted";
console.log(`Event: ${event.type} - ${isPersisted}`);
break;
}
default:
console.log(`Event: ${event.type}`);
break;
}
};
events.forEach((eventName) => window.addEventListener(eventName, eventLogger));
HTML
<p>
Open the console and watch the output as you navigate to and from this page.
Try loading new pages into this tab, then navigating forward and backward
through history, noting the events' output to the log.
</p>
Ergebnisse
Spezifikationen
| Specification |
|---|
| HTML # event-pageshow |