0

I need a script that, when user closes the page, waits few seconds (without popups) and then closes the page.

I remember seeing somewhere here a way to do this, using ajax (if I remember correctly), by running a php file and waiting the answer before closing, but I can't find it anymore. The php file contained sleep-function.

Any help is greatly appreciated


(This is used mainly to fade out text. When user comes to site text fades in via css3 transition, and when he leaves page the text fades out. I just need time for fadeout. Yes, I know this is not user-friendly but I was specially asked to do it this way)

user1829015
  • 57
  • 1
  • 6

2 Answers2

2

Your probably thinking of a synchronous ajax request (which blocks the UI):

window.addEventListener('unload',function()
{
    var xhr = new XMLHttpRequest();
    xhr.open('GET', 'script.php?when=unload',false);//<-- false makes request synchronous
    xhr.send();
},false);

But there are other ways, check this answer
On the whole, I'd not do things like this. If a site attempted to deny me the option of closing the window when I feel like it, I'd never use/visit it again. That, and the fact that your JS code is still subject to how the browser implements it, and the browser can be controlled by the client's OS. If I close the browser application, a JS event has nothing to say in that matter, especially if I terminate the browser process (using kill -9, or ctrl+alt+del).

The very least you can do is offer the client a choice, to either force-quit, or wait, explaining why you'd rather the client waited a while:

window.addEventListener('beforeunload',function u(e)
{
    var forceQuit = confirm('\tDo you wish to leave Now?\n
                            if you do, some changes you made won\'t be saved');
    if (forceQuit)
    {
        return e;
    }
    //synchronous ajax result here, or:
    e.returnValue = false;
    e.cancelBubble = true;
    if (e.preventDefault)
    {
        e.preventDefault();
        e.stopPropagation();
    }
    setTimeout(function()
    {//first, remove handler, so the beforeunload's behaviour is back to default
        window.removeEventListener('beforeunload',u,false);
        //dispatch new beforeunload event:
        window.dispatchEvent( new Event('beforeunload'));
    },5000);
},false);
Community
  • 1
  • 1
Elias Van Ootegem
  • 74,482
  • 9
  • 111
  • 149
  • I wouldn't do it either if I had a choice but... Upper one works if user clicks link or refreshes, but not when he closes tab. Any help with that? I don't need a confirmation, and it doesn't matter if browser is terminated. – user1829015 Sep 12 '13 at 07:08
  • @user1829015: change the `unload` event to `beforeunload`, if needs must, attach it directly to the window (`window.onbeforeunload = function(e){};`. PS: It _does_ matter if the browser is terminated, because in most browsers, each tab is a new process. By closing that, you close the current window. Closing a tab === teminating the browser, as far as your JS script is concerned. A `confirm` is just for the user. I'd hate being forced to wait for a script to finish running. I didn't _ask_ for it (that's how your users will feel). JS will never (thank god) give you full control – Elias Van Ootegem Sep 12 '13 at 07:15
0

Have a look at jquery unload. You can bind a delay-function to the unload-event.

Vince
  • 1,517
  • 2
  • 18
  • 43