5

Is there any way that I could detect in the following code that either user clicked "leave page" or "stay on page" button ?

$(window).on('beforeunload', function (){
    return "You save some unsaved data, Do you want to leave?";
});
beatgammit
  • 19,817
  • 19
  • 86
  • 129
Umer Hassan
  • 1,119
  • 6
  • 16
  • 23

2 Answers2

13

With a few hacks you can at least determine if the user stayed.
If the user left the page, there's not much you can do about that :

var timeout;

$(window).on('beforeunload', function (){
    timeout = setTimeout(function() {
        // user stayed, do stuff here
    }, 1000);
    return "You save some unsaved data, Do you want to leave?";
});

FIDDLE

adeneo
  • 312,895
  • 29
  • 395
  • 388
  • 1
    @VAGABOND - When the unload event is triggered (when the user leaves) the confirm pops up to ask wether or not to leave. As you can't add any code after the return statement as that wouldn't be executed, you can add it in a timeout that is executed if the user decided to stay. If the user left the page, everything is lost anyway so the timeout will never execute. – adeneo Sep 03 '13 at 15:02
  • so basically ,code in time out is executed after return?and in your fiddle i saw a timeout function which clears the timeout..that is what confused me...coz the code worked without that also.. – HIRA THAKUR Sep 03 '13 at 15:05
  • Yes, never mind that, it's just something I apparently forgot to remove. – adeneo Sep 03 '13 at 15:10
  • @adeneo COde is working fine if user decides to stay. But if user click on "Leave this page" button, noTimeout function is not being executed. alert("You're leaving!") is not getting fired. – Bit_hunter Aug 02 '15 at 06:21
  • Well, no, once you've left, nothing gets executed? – adeneo Aug 02 '15 at 12:56
  • @adeneo, According your code, if user clicks the "Leave" button after 2-3 seconds, your code will still fire! and we should fire it only when user stays and does not leave at all! – Faisal Alvi Nov 29 '17 at 11:37
  • @FaisalAlvi - not sure I get it? When the native popup appears, timers are halted, just as with alerts, so no, if the user waits before pressing the button, it shouldn't matter. – adeneo Nov 30 '17 at 01:49
  • @adeneo Timers will never halt. Any code in beforeunload function executes when native popup appears. This is impossible to delay/halt the code. – Faisal Alvi Dec 01 '17 at 02:07
  • 2
    @FaisalAlvi - you're certainly wrong about that. Native alerts will always halt timers, and in modern browsers, even leaving the tab will halt the timers -> https://jsfiddle.net/ek5xt59s/ – adeneo Dec 02 '17 at 11:32
0

iirc, the unload event is not triggered, when the user decides to stay on the page. so:

$(window).on('unload', function (){
    // user has left the page, do stuff here
}
hakai
  • 329
  • 3
  • 13
  • 1
    While this is true, you have almost no functionality in the unload event because the page is already unloading. So you won't be able to get many things done inside of this method. – Brian Jul 23 '13 at 16:12
  • It is correct, that you can't interact with the user at this point. All user interaction has to be done before unloading (i.e. in the beforeunload event). The DOM should still be intact though. So it is at least possible to get some data to your server via async calls. – hakai Jul 25 '13 at 10:00