Javascript exit page dialog box

Source: Internet
Author: User

If a dialog box is displayed when you exit the page, the user is prompted to exit the page. This is similar to setting a function that does not save the page. This implementation method is relatively simple. The most common method is to use the unload event. However, this implementation has the disadvantage that the page will exit regardless of whether the result is the same or not. Therefore, if you want to bring up a dialog box, you can select a space. If you are sure, exit. Otherwise, the page will not be closed, as shown below:

Click here to view online instances
Http://www.biuuu.com/demo/unload/index.html

We recommend that you useOnbeforeunload() An event refers to the method executed before the unload event is loaded. Use the following:

    1. <SCRIPT type = "text/JavaScript">
    2. Window.Onbeforeunload= Function (){
    3. Return "you are prompted to log out of the page. Are you sure you want to exit the page? ";
    4. }
    5. </SCRIPT>

In this case, a dialog box is displayed, and the page is exited only after confirmation.

Window.OnbeforeunloadYou can use jquery to set the prompt effect when the page is not saved, that is, if the page is saved, a dialog box should not be displayed. You can use the following method.

Prompt dialog box:

    1. <SCRIPT type = "text/JavaScript">
    2. Window.Onbeforeunload= Function (){
    3. Return;
    4. }
    5. </SCRIPT>

In this way, the page is exited without any dialog box.

in combination with jquery, the Javascript exit page pop-up dialog box is used in combination with the preceding two methods. If the page meets certain conditions, a dialog box is displayed if needed. Otherwise, no dialog box is displayed, this is very convenient. jquery has its own unload method, but it cannot return the result. There is only one result, that is, exit the page. Therefore, combined with window. onbeforeunload can be used to exit the dialog box.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.