How to know return of window.onbeforeunload

Question

i have JS function window.onbeforeunload which returns a msg and browser shows that in confirmbox. Now how will i know whether user clicked on leave that page or stay on page ?

Javascript

window.onbeforeunload = function(e) {
 return "Click STAY ON PAGE then SAVE to save any data you've entered.\n If you've already SAVED select LEAVE PAGE to continue."; 
}

http://jsfiddle.net/Ly6WE/

If the user is no longer on the page, chances are they left. — Shomz, Aug 01 '14 at 09:54
@Shomz but if they stay i need to change value of variable. how do i do that ? — Sharath Bangera, Aug 01 '14 at 09:55
@AdrianoRepetti M not concerned abt them leaving the page. i am concerned if they stay. i need to update one variable. anyway to do it ? — Sharath Bangera, Aug 01 '14 at 09:58
You can't really. You could set a timeout function see [this][1] [1]: http://stackoverflow.com/questions/4650692/way-to-know-if-user-clicked-cancel-on-a-javascript-onbeforeunload-dialog — , Aug 01 '14 at 10:02
@Shomz I don't really think that is a solution. The value has changed when you have fired the event not after it has unloaded. Either way if they stay or leave that value has changed before they have made a decision. — , Aug 01 '14 at 10:21
@jbyrne2007 OP needs an updated variable if they stay. I understand what you're saying and yes, in many cases my solution won't work, but in this case it works just fine because the problem here is more about thinking outside the box than coding. — Shomz, Aug 01 '14 at 10:49
@Shomz I agree in some instances this may work and it is thinking outside the box, but the question was how he will know if the user has clicked to leave or stay on the page, you can't. — , Aug 01 '14 at 10:59

Shomz · Answer 1 · 2014-08-01T10:08:27.100

Update the variable anyway. If they stayed, you get what you want; if they left, it won't matter.

window.onbeforeunload = function(e) {
   var myVariable = 'updated value'; // of course, var not from this scope
   return "Click STAY ON PAGE then SAVE to save any data you've entered.\n If you've already SAVED select LEAVE PAGE to continue."; 
}

See what happens to x after you try to leave: http://jsfiddle.net/shomz/Ly6WE/3/

score 0 · Answer 2 · answered Aug 01 '14 at 10:08

0

Crossbrowser code which realize this:

    (function() {
        function beforeUnload(event) {
            event = event || window.event;

            var confirmationMessage = 'Changes not saved';

            event.returnValue = confirmationMessage;
            return confirmationMessage;
        }

        window.addEventListener('beforeunload', beforeUnload, false);
    })();

And that's how this will work. When beforeUnload triggered, user will get confirmation box with 2 button "Leave this page" and "Stay on this page". When user press "Leave this page" -> tab will close. But when user click "Stay on this page" -> nothing will happen and user don't lose data.

answered Aug 01 '14 at 10:08

Eugene Obrezkov

2,910
2
17
34

This is pretty much the same that OP originally had. – Shomz Aug 01 '14 at 10:10
1. event better get from window.event if event will be undefined. 2. If ```return``` not works, then need add ```event.returnValue``` and this will work. Of course this is pretty much the same, but it contains a few improvements that works better. – Eugene Obrezkov Aug 01 '14 at 10:14

How to know return of window.onbeforeunload

2 Answers2