Get the App
SLTechnology News&Howtos  ›  Development  › 

How to use onbeforeunload events

Shulou Source: shulou.com Published: 2022-06-03 11:01:32 09月29日 Update

This article will explain in detail how to use onbeforeunload events. The editor thinks it is very practical, so I share it with you as a reference. I hope you can get something after reading this article.

The onbeforeunload event is triggered when you are about to leave the current page (refresh or close). This event can be used to pop up a dialog box indicating whether the user should continue browsing the page or leave the current page.

Definition and usage of onbeforeunload

The default prompt for the dialog box varies from browser to browser, and the standard message is similar to "are you sure you want to leave this page?" . The information cannot be deleted.

However, you can customize some message tips to be displayed in the dialog box with standard information.

Note: if you do not specify an onbeforeunload event on the element, you need to add the event to the window object and use the returnValue attribute to create custom information (see the syntax example below).

Note: in Firefox browsers, only default reminder messages are displayed (no custom messages are displayed).

Browser support

The number in the table represents the version number of the first browser that supports the event.

Event

Onbeforeunload Yes Yes Yes Yes 15.0

Grammar.

In HTML:

Give it a try

In JavaScript:

Object.onbeforeunload=function () {myScript}; try it

In JavaScript, use the addEventListener () method:

Object.addEventListener ("beforeunload", myScript); try it

Note: the addEventListener () method is not supported in InternetExplorer8 and earlier IE versions.

Technical details of onbeforeunload

Whether bubbling is supported: No

Can I cancel: Yes

Event type: Event

Supported HTML tags:

This is the end of this article on "how to use onbeforeunload events". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, please share it for more people to see.

Tags: Events information support browsing dialogs articles pages dialogs attempts tips different methods more standards versions syntax good practical elements Apple Docker Huawei Linux macOS MariaDB Microsoft MySQL NVidia OPPO Reno Microsoft Docker Shulou Information Apple Xiaomi