Window: событие pagehide

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.

Событие pagehide отправляется объекту Window, когда браузер скрывает текущую страницу в процессе отображения других страниц из истории сессии.

Например, когда пользователь нажимает на кнопку "Назад" в браузере, перед тем, как отобразиться предыдущая страница, текущая страница сгенерирует событие pagehide.

Всплывает Нет
Отменяемое Нет
Интерфейс PageTransitionEvent
Свойство обработчика событий onpagehide

Примечания по использованию

По аналогии с событиями unload и beforeunload, это событие не всегда срабатывает в браузерах, особенно на мобильных. Например, событие pagehide может вовсе не сработать в следующем сценарии:

  1. Пользователь открывает страницу с мобильного браузера.
  2. Некоторое время спустя он переключается на другое приложение.
  3. А затем он закрывает браузер при помощи менеджера приложений.

Тем не менее, в отличие от событий unload и beforeunload, это событие совместимо кешом для перехода вперёд и назад (bfcache), поэтому обработчик этого события не помещает странице быть закешированной в bfcache.

Поэтому, чтобы определить завершение пользовательской сессии предпочтительнее всего использовать событие visibilitychange. Если в браузерах не поддерживается visibilitychange, вместо него следует использовать событие pagehide как наиболее подходящую альтернативу.

В случае, если нужно определить именно наступление событий unload, то событие pagehide как нельзя лучше подойдёт для этого.

Дополнительные сведения о том, как данное событие связано с другими событиями жизненного цикла страницы, смотрите на странице Page Lifecycle API.

Примеры

В следующем примере добавлен обработчик для отслеживания событий pagehide, чтобы что-то сделать на случай, если страница была сохранена в кеше для возможного повторного использования.

js
window.addEventListener(
  "pagehide",
  (event) => {
    if (event.persisted) {
      /* Страница была сохранена в кеше, её можно повторно использовать */
    }
  },
  false,
);

Этот обработчик также можно написать с помощью свойства обработчика события onpagehide в объекте Window:

js
window.onpagehide = (event) => {
  if (event.persisted) {
    /* Страница была сохранена в кеше, её можно повторно использовать */
  }
};

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

Specification
HTML Standard
# event-pagehide

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

BCD tables only load in the browser

Смотрите также

  • Событие pageshow.
  • Page Lifecycle API содержит рекомендуемые практики по обработке поведения жизненного цикла страницы в веб-приложениях.
  • PageLifecycle.js: JavaScript-библиотека, которая решает несоответствия в работе жизненного цикла страница в разных браузерах.
  • Кэш для перехода назад и вперед объясняет, что такое кеш "назад/вперед", и его последствия для различных событий жизненного цикла страницы.