Окно: событие pageshow

Базовая Широко доступна

Эта функция хорошо зарекомендовала себя и работает на многих устройствах и версиях браузеров. Она доступна в браузерах с июля 2015 года.

Событие pageshow отправляется в Window, когда браузер отображает документ окна из-за навигации.

Это включает:

Первоначальную загрузку страницы
Переход к странице с другой страницы в том же окне или вкладке
Восстановление замороженной страницы на мобильных ОС
Возврат на страницу с помощью кнопок «Вперед» или «Назад» браузера

Примечание: При первоначальной загрузке страницы событие pageshow срабатывает после события load.

Синтаксис

Используйте имя события в методах, таких как addEventListener(), или задайте свойство обработчика событий.

addEventListener("pageshow", (event) => {});
onpageshow = (event) => {};

Тип события

A PageTransitionEvent. Наследуется от Event.

Свойства события

PageTransitionEvent.persisted Только чтение: Указывает, загружается ли документ из кэша.

Псевдонимы обработчиков событий

Помимо интерфейса Window, свойство обработчика событий onpageshow также доступно для следующих целевых объектов:

Примеры

В этом примере устанавливаются обработчики событий для событий, перечисленных в массиве events. Обработчик eventLogger() выводит в консоль тип произошедшего события и включает значение флага persisted для событий pageshow и pagehide.

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>

Результаты

Спецификации

Спецификация
HTML # event-pageshow

Совместимость с браузерами

	Рабочий стол					Мобильный
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox для Android	Opera Android	Safari на iOS	Samsung Internet	WebView Android
`pageshow_event`	3	12	6	15	5	18	6	14	4.2	1.0	≤37

См. также

pagehide

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/Window/pageshow_event