OnUnload and onbeforeunload are all called during refresh or shutdown. You can use window. onUnload in the <SCRIPT> script to specify them or in <body>. The difference is that onbeforeunload is executed before onUnload, which can also prevent onUnload execution.
Onbeforeunload is also called when the page is refreshed or closed. onbeforeunload is called when the server is about to read the new page. At this time, it has not started to read; onUnload has read the new page to be loaded from the server and is called when the current page is to be replaced. OnUnload cannot prevent page updates or closures. Onbeforeunload can be used.
1. onbeforeunload event:
Note: currently, Firefox and IE of the three major browsers support onbeforeunload events, but opera does not.
Usage:
· Object. onbeforeunload = Handler
· <Element onbeforeunload = "handler "... > </Element>
Description:
When an event is triggered, a confirmation and cancellation dialog box is displayed. If you are OK, the page is left. If you cancel the event, the page continues to be canceled. Handler can set a return value as the displayed Text of the dialog box. Triggered on:
· Close the browser window
· When you go to other pages through the address bar or Favorites folder
· Click return, forward, and refresh. When one of the home pages is displayed
· When you click a URL to connect to another page
· Call any of the following events: Click, document write, document open, document close, window close, window navigate, window navigateandfind, location replace, location reload, form submit.
· When you use window open to open a page and pass the window name on this page to the page to open.
· When the location. href value is assigned again.
· When submitting a form with the specified action through the input type = "Submit" button.
It can be used in the following elements:
· Body, frameset, window
Platform support:
Ie4 +/win, Mozilla 1.7a +, Netscape 7.2 +, firefox0.9 +
Example: < HTML xmlns = " Http://www.w3.org/1999/xhtml " >
< Head >
< Meta HTTP - Equiv = " Content-Type " Content = " Text/html; charset = gb2312 " / >
< Title > Onbeforeunload Test < / Title>
< Script >
Function Checkleave (){
Event. returnvalue = " Are you sure you want to leave the current page? " ;
}
< / SCRIPT>
< / Head>
< Body onbeforeunload = " Checkleave () " >
< / Body>
< / HTML>
However, there is a small problem with onbeforeunload, that is, when the page is refreshed, it will still call onbeforeunload. Why? In fact, refreshing is equivalent to disabling IE and re-opening it, so it will still be called to onbeforeunload.
How does one solve the problem of not calling onbeforeunload for refresh?
There are many methods available on the Internet. I think the most practical is the following section of JS
Window. onbeforeunload = Function (){
VaR N = Window. event. screenx - Window. screenleft;
VaR B = N > Document.doc umentelement. scrollwidth - 20 ;
If (B && Window. event. clienty < 0 | Window. event. altkey)
{
Alert ( " Is to close, not refresh " );
Window. event. returnvalue = " Disable? " ;
} Else {
Alert ( " Refresh, not close " );
}
}
2. onUnload Event
Usage:
· Object. onbeforeunload = Handler
· <Element onbeforeunload = "handler"> </element> description:
The onUnload Event is triggered when the user closes a page.
Triggered on:
· Close the browser window
· When you go to other pages through the address bar or Favorites folder
· Click return, forward, and refresh. When one of the home pages is displayed
· When you click a URL to connect to another page
· Call any of the following events: Click, document write, document open, document close, window close, window navigate, window navigateandfind, location replace, location reload, form submit.
· When you use window open to open a page and pass the window name on this page to the page to open.
· When the location. href value is assigned again.
· When submitting a form with the specified action through the input type = "Submit" button.
Example:
< HTML xmlns = " Http://www.w3.org/1999/xhtml " >
< Head >
< Meta HTTP - Equiv = " Content-Type " Content = " Text/html; charset = gb2312 " / >
< Title > OnUnload Test < / Title>
< Script >
Function Checkleave (){
Alert ( " Come back next time! " );
}
< / SCRIPT>
< / Head>
< Body onUnload = " Checkleave () " >
< / Body>
< / HTML>
