javascript - How to capture the destination URL in onbeforeunload event - Stack Overflow

admin管理员组

文章数量:1321236

I want to use onbeforeunload to give a message to users before leaving certain pages. Is it possible to know which URL they are supposed to jump to at the onbeforeunload event?

I want to use onbeforeunload to give a message to users before leaving certain pages. Is it possible to know which URL they are supposed to jump to at the onbeforeunload event?

• javascript
• dom-events

Share Improve this question Follow edited Apr 10, 2023 at 9:17 Brian Tompsett - 汤莱恩 5,8937272 gold badges6161 silver badges133133 bronze badges asked Oct 3, 2010 at 9:32 NirNir 25.4k2626 gold badges8484 silver badges120120 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

Is it possible to know which url they are supposed to jump to at the onbeforeunload event?

No, definitely not. The onbeforeunload event tells you only that the page is about to be unloaded, but not why.

It depends on how the user is leaving the page. If they are typing an url in the address bar - then you're out of luck. As far a I know there's no way to capture the url of an address bar jump.

If they are clicking on a link contained somewhere on the page - that you can use the click event to capture the url and then decide how you want to handle things.

I posed a similar question
How can i get the destination url of a link on the web page in the javascript onbeforeunload event?
because I had a project to fix a wholesale order form. During the process of filling out an order my client's customers would go back to the catalog to check on a product's detail page and loose the current information on their order form.
By using the code below (which uses JQuery though I'm sure you could create the same thing in pure Javascript if you had to) I could tell when the user clicked a link that would leave the order form and then give them the option of opening the link in a new window/tab or loading the url in the current window and loosing their form data, or just returning to the form. This code works with all of the major browsers, at least their more recent versions.

$('body a').click(function(e) {     
    //if link references a page element
    if ($(this).attr('href').charAt(0)=="#") {
        return;
    }

    //check if link is to same window    
    var pathname = window.location.pathname;
    var pathname2 = $(this).attr('href');
    pathname2 = pathname2.replace(/^.+\.\//, '');
    if (pathname.indexOf(pathname2) >= 0) {
        //link clicked is contained on same page
        //prevent page from getting reloaded & losing data
        e.preventDefault();
        e.stopImmediatePropagation();
        e.stopPropagation();    
        return;     
     }

    //link clicked on is another page
    if (hasMerchandise) {  //var to indicate user has items on order form       
        //give user options: leave page, open link in other page, stay, etc.
        // $('.popupForm-handleExitRequest').click();   //roll your own code    

        //prevent page from getting reloaded & losing data
        //in case user wants to cancel page change or open link in another window
        e.preventDefault();
        e.stopImmediatePropagation();
        e.stopPropagation();            
    } else {
        //load new page
        $(this).removeAttr('target');
    }       
});

本文标签： javascriptHow to capture the destination URL in onbeforeunload eventStack Overflow