9

I need a message script that will only come up when people are leaving the current webpage and not the current website.

When people are leaving the website entirely, the message will come up and they will need to press the OK button to stay at the current page (and cancel to leave the website).

The script may not run when people actually stay on the website or when they click on internal links or pages.

Can this be done?

Arnold Zokas
  • 8,306
  • 6
  • 50
  • 76
tumtummetjes
  • 91
  • 1
  • 1
  • 2
  • ps my webiste http://www.consolepro.net which profides nintendo wii softmod soft mod does have a script which generate the link automaticly – tumtummetjes May 27 '10 at 13:43
  • Possible duplicate of [Display a warning when leaving the site, not just the page](http://stackoverflow.com/questions/2365994/display-a-warning-when-leaving-the-site-not-just-the-page) – KyleMit Apr 13 '17 at 12:34

3 Answers3

6

Check out this very basic example solution. It sets the onbeforeunload handler but then removes it if the user clicks an internal link. Below is a generic version of the code from the example solution.

HTML:

<a href="internal_link.html">internal link</a>
<a href="http://www.example.com">external link</a>

JS (uses jQuery):

window.onbeforeunload = function(){
    return "Are you sure you want to leave our website?";
}
$(function(){
    $('a, input, button').click(function(){
            window.onbeforeunload = null;
    });
});
Ofer Zelig
  • 17,068
  • 9
  • 59
  • 93
Adam
  • 1,744
  • 1
  • 14
  • 34
  • so what will be the total code iclude the query string etc? and i dont understand the internal link part? as i cannot change our internal links which are automativly generated by our shopping cart – tumtummetjes May 28 '10 at 00:18
  • The line `internal link` is simply an example of a link which will have the same domain name as `location.host`. Any link which is "internal" to your website (meaning it doesn't link to a different domain) should cause the `if` statement `this.href.match(location.host)` to return `true`, causing the `onbeforeunload` handler to be removed, thus preventing preventing the message `"Are you sure you want to leave our website?"` message from popping up. [... comment continued below ...] – Adam Jun 02 '10 at 04:24
  • [... comment continued from above ...] Links like the second one (`external link`) *will* cause the message to pop up (as you desired) since they will have a different domain from `location.host`. (Sorry if there was confusion from forgetting the `onbeforeunload` handler in my first post. Please refer to the example solution http://polymath.mit.edu/projects/test/stackoverflow/onbeforeunload_external_links.html if you have any other questions.) – Adam Jun 02 '10 at 04:25
  • For anyone else confused about what `if` statement @Adam was referring to, turns out someone edited his answer to improve it, but actually changed it significantly, so the internal vs external link check is no longer there. See https://stackoverflow.com/posts/2925855/revisions – redfox05 Feb 19 '19 at 15:59
1

In most cases you don't need a popup for all events except the one: user closes the window.

Here is my solution for this:

$(window).on('beforeunload', function() {
    /* whatever you want here */
}   

$(document).on('click keydown', function(){
    $(window).off('beforeunload');
});
KyleMit
  • 30,350
  • 66
  • 462
  • 664
vchik
  • 69
  • 3
1

I got a similar problem. However in my case this message was supposed to be translated according with the user's language, if anyone presses F5 or close the window.

Follow my small example.

<html>
<head>
<script type="text/javascript">
function closeThis()
{
    if (window.confirm("Minha mensagem!")){
        window.close();
    }
}

function test() 
{
    // Add a warning in case anyone tries to navigate away or refresh the page
    return confirm("Minha mensagem");
}


</script>
</head>
<body onbeforeunload=test();>
<p>Hello World! Press F5 or Close this Window</p>
</body>
</html>