Window: beforeunload event

Событие beforeunload запускается, когда окно, документ и его ресурсы вот-вот будут выгружены. Документ все ещё виден, и событие в этот момент может быть отменено.

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

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

В соответствии со спецификацией, для отображения диалогового окна подтверждения обработчик события должен вызватьpreventDefault() по событию.

Однако обратите внимание, что не все браузеры поддерживают этот метод, а некоторые требуют от обработчика событий реализации одного из двух старых методов:

  • назначение строки свойству returnValue события
  • возвращающий строку из обработчика событий.

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

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

Прикрепление обработчика событий к window или document beforeunload событие не позволяет браузерам использовать кеш навигации по страницам в памяти, наподобие Firefox's Back-Forward cache or WebKit's Page Cache.

В спецификации HTML указано, что вызовы window.alert(), window.confirm(), и window.prompt() методы могут быть проигнорированы во время этого события. Посмотреть HTML specification для более подробной информации.

Примеры

В HTML-спецификации указано, что авторы должны использовать метод Event.preventDefault(), а не Event.returnValue. Однако, это поддерживается не всеми браузерами.

js
window.addEventListener("beforeunload", (event) => {
  // Отмените событие, как указано в стандарте.
  event.preventDefault();
  // Chrome требует установки возвратного значения.
  event.returnValue = "";
});

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

Specification
HTML Standard
# event-beforeunload
HTML Standard
# handler-window-onbeforeunload

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

BCD tables only load in the browser

Смотрите WindowEventHandlers/onbeforeunload для получения более подробной информации о том, как различные браузеры обрабатывают это событие.

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