Alert when page closing, do something when page won't closed

Question

Found a working script on the internet, except that I can't change the message for FF. Which would be great. (Works for Chrome)

window.onbeforeunload = function(e) {
    if(!e) e = window.event;
    e.cancelBubble = true;
    e.returnValue = 'You sure you want to leave?';

    if(e.stopPropagation) {
        e.stopPropagation();
        e.preventDefault();
    }
};

What ever, this works great. But I wanna do something when the user clicks on abort to keep visiting the page.

How I could do that?

possible duplicate of [Firefox 4 onBeforeUnload custom message](http://stackoverflow.com/questions/5398772/firefox-4-onbeforeunload-custom-message) — CodingIntrigue, Aug 10 '15 at 07:16
To CVers, this is not a dupe, here the question is how to detect the event has been canceled — Kaiido, Aug 10 '15 at 08:26
@Kaiido The above vote close is a good example why you should ask **one** question per question. — Etheryte, Aug 10 '15 at 08:28
@Nit, there is only one, ok there is some noise about the non functioning and marked as dupe thing about FF but still, it's not a question to me. But I do agree it's not necessary and the link provided is actually usefull, just not a dupe — Kaiido, Aug 10 '15 at 08:30

score 3 · Accepted Answer · edited Jun 20 '20 at 09:12

3

You could use a timed function to do something if user decides to stay on page. The confirmbox shown by onbeforeunload is blocking the execution untill user clicks either OK or Cancel. If Cancel will be clicked, the timed function will be executed, otherwise the page is closed, and the timed function will never be executed.

The code would be something like this:

window.addEventListener('beforeunload', function (e) {
    e.preventDefault();
    e.returnValue = 'Do you want to leave the page?';
    setTimeout(function () { // Timeout to wait for user response
        setTimeout(function () { // Timeout to wait onunload, if not fired then this will be executed
            console.log('User stayed on the page.');
    }, 50)}, 50);
    return 'Do you want to leave the page?';
});

A working demo at jsFiddle.

You can't show a message in the confirmbox in FF for the reason explained in the accepted answer in the post RGraham has linked in their comment.

edited Jun 20 '20 at 09:12

Community

1
1

answered Aug 10 '15 at 07:50

Teemu

22,918
7
53
106

1

Your demo at jsFiddle doesn't work for Chrome and FF. – tomew Aug 10 '15 at 08:39
1

No? It shows me a message in the console in FF and Chrome if I stayed on the page. Make sure you're not changing anything in the fiddle, in that case jsFiddle's own `onbeforeunload` handler might override the user's event. – Teemu Aug 10 '15 at 08:42
Oh well, I thought there pop an alert. Works fine, thank you! <3 – tomew Aug 10 '15 at 09:32
on my FF, it fires even if I do click the "leave page". The setTimeout is called before the prompt, so it has no effect if I stay longer than the timeout on this prompt – Kaiido Aug 10 '15 at 10:29
Tested in the fiddle, just clicking the "run" button – Kaiido Aug 10 '15 at 10:35
@Kaiido That's an effect due to other `onbeforeunload` handlers on jsFiddle. Using this code you can have this one handler only. – Teemu Aug 10 '15 at 10:39
@Teemu just tested locally, same problem on FF. check with `preserve log: true` in your console. IMO what is happening is that the `setTimeout` is called before the prompt. Then the prompt is here, all code execution is delayed but the timeout still runs. Then code execution starts again, if user stayed longer (can't be calculated), then it will make a false valid, otherwise, we've got lucky. – Kaiido Aug 10 '15 at 10:42
1

One solution seems to have an other timeout function nested in the first one – Kaiido Aug 10 '15 at 10:48
1

@Kaiido Looks like you're right. Actually IE doesn't allow the timeout to be executed, but Chrome and FF will. I'll add the second timeout to the answer to tackle the issue in "all" browsers. – Teemu Aug 10 '15 at 10:50

Alert when page closing, do something when page won't closed

1 Answers1

Linked

Related