By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,843 Members | 2,300 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,843 IT Pros & Developers. It's quick & easy.

Getting event when user clicks X in browser, something different from {before}bodyunload

P: n/a
Hi all,
I am trying to get a way by which I'll know exactly when user goes out
of my site by clicking on close button in browser, So that w/e user
click close button in browser, I can send a signal to server.
This seems to be achievable with body unload events, but it is little
too much, as even if user navigate within my site, this event will be
generated, this can be avoided by handling onclick of each link, so
that I'll know exactly which link is clicked, but honestly this looks
over doing to me, any other smart short cut for finding out when user
click on X in browser?

TIA
Hemant

Sep 3 '06 #1
Share this Question
Share on Google+
6 Replies


P: n/a
he**********@gmail.com wrote:
I am trying to get a way by which I'll know exactly when user goes out
of my site by clicking on close button in browser, So that w/e user
click close button in browser, I can send a signal to server.
You can't. Nor can you tell when the user "closes" their browser by turning
their computer off, having their Internet connection fail, etc, etc.
--
David Dorward <http://blog.dorward.me.uk/ <http://dorward.me.uk/>
Home is where the ~/.bashrc is
Sep 3 '06 #2

P: n/a
he**********@gmail.com wrote:
Hi all,
I am trying to get a way by which I'll know exactly when user goes out
of my site by clicking on close button in browser, So that w/e user
click close button in browser, I can send a signal to server.
This seems to be achievable with body unload events, but it is little
too much, as even if user navigate within my site, this event will be
generated, this can be avoided by handling onclick of each link, so
that I'll know exactly which link is clicked, but honestly this looks
over doing to me, any other smart short cut for finding out when user
click on X in browser?

TIA
Hemant
Except the body.onunload event/function, there's no other solution for
this. May I suggest that you create a general function as this :

(Untested !)

window.gotoLink( url, disconnect ) {
// if disconnect is undefined or false
if ( !disconnect ) {
window.noUnloadWarning = true; // do not warn when unloading the
page
}

document.location.href = url; // use Javascript to load this url
into the current browser
};
// ....
window.body.onunload = function(e) {
// if window.noUnloadWarning is not set, it means that we're not
// refreshing the page with a new link, but the user tries to close
// the browser
if ( !window.noUnloadWarning ) {
// if confirm is 'No', we simply return false to the event, and the
browser stays
// active
if ( !confirm( "You are about to close your browser. " +
"Do you really want to terminate your " +
"session on this site ?" ) ) {
return false; // returning false will not unload, thus not
close the browser
}
}
return true;
};
------------- eoc -------------------

and call this function in all your anchors (<aelements) such as :

<a href="#"
onclick="gotoLink('http://www.blah.com&var=foo&var2=bar');">Click me
!</a>
Good luck !

-Yanick

Sep 3 '06 #3

P: n/a
Yanick said the following on 9/3/2006 9:15 AM:
he**********@gmail.com wrote:
>Hi all,
I am trying to get a way by which I'll know exactly when user goes out
of my site by clicking on close button in browser, So that w/e user
click close button in browser, I can send a signal to server.
This seems to be achievable with body unload events, but it is little
too much, as even if user navigate within my site, this event will be
generated, this can be avoided by handling onclick of each link, so
that I'll know exactly which link is clicked, but honestly this looks
over doing to me, any other smart short cut for finding out when user
click on X in browser?

TIA
Hemant

Except the body.onunload event/function, there's no other solution for
this.
The onunload event is not even close to a solution though. The
"solution" to the problem is to solve it on the server. Use Sessions and
Timeouts and your problem is solved.
May I suggest that you create a general function as this :
You can suggest it, but it still won't do what is requested.

Test your code, get the bugs out. Then load your page and then click the
Refresh button to reload the page....
(Untested !)

window.gotoLink( url, disconnect ) {
One of the problems with untested code is you don't find flaws such as
your "disconnect" flaw. It is never defined anywhere in your code so it
will always be undefined. If it is always going to have one state, there
isn't a whole lot of point in testing it is there?
// if disconnect is undefined or false
if ( !disconnect ) {
window.noUnloadWarning = true; // do not warn when unloading the
page
}

document.location.href = url; // use Javascript to load this url
into the current browser
};
// ....
window.body.onunload = function(e) {
// if window.noUnloadWarning is not set, it means that we're not
// refreshing the page with a new link, but the user tries to close
// the browser
That comment is utterly false and *very* misleading. There are other
ways to trigger the onunload without closing the browser.

Try clicking the Back button.....
<snip>
and call this function in all your anchors (<aelements) such as :

<a href="#"
onclick="gotoLink('http://www.blah.com&var=foo&var2=bar');">Click me
!</a>
That is even worse. It falls into the degradation problem where non-JS
browsers (or an error in the page) makes the page useless.

If you insist:

<a href="http://www.blah.com" onclick="return gotoLink(this.href)">My
Link</a>

Why do people insist on trying to make scripting harder than it is?

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Sep 3 '06 #4

P: n/a
Randy :

How nice of you to always point out other person's errors. It really
makes me feel like I tried, doesn't it ? I shall say that you post is
no better since it doesn't give any further solution to the problem.
The onunload event is not even close to a solution though. The
"solution" to the problem is to solve it on the server. Use Sessions and
Timeouts and your problem is solved.
How would that help to know when the user closes the browser versus or
simply clicked on a link ?
That comment is utterly false and *very* misleading. There are other
ways to trigger the onunload without closing the browser.

Try clicking the Back button.....
Well, how do you know ! I didn't consider that. Except the critisizing
comment in the first statement, that is constructive.
Why do people insist on trying to make scripting harder than it is?
Maybe because some people insist on not giving them any examples with
clear solutions, but only conceptual suggestions... which, I may add,
are not always connected to the problem.

Like I said to you in an earlier post, I have no grief against you. I
believe that you are knowledgeable, and somewhat ressourceful. Though
everytime I read your posts, I can't help to feel that you're putting
down those you tried to help before you.

As for the solution proposed, for the two reasons that you have
mentionned :
1) javascript issues
2) back button that'd fire the unload event
It is clear that the solution had issues. But I still stick to my
suggestion :

To he**********@gmail.com (the OP) :

This is a (tested) solution. It doesn't fix your back/foreward button
(you don't know if the 'X' or close button has been clicked, or if the
user simply press 'Back' or 'Foreward'), but it's a start (taken from
http://www.webreference.com/dhtml/di.../bunload4.html,
http://pro-thoughts.blogspot.com/200...oad-event.html) :

// take all anchors and disable the confirmation box
// in their onclick events
var anchors = document.getElementsByTagName('a');
var noUnloadConfirm = function() { setCloseConfirmation(false); };
for (var i=0; i<anchors.length; i++) {
anchors[i].onclick = noUnloadConfirm;
}
var closeConfirmationHandler = function(event){
//event = event||window.event;
var mess = "Wait! You haven't finished."
return mess;
}

function setCloseConfirmation(on){
window.onbeforeunload = (on) ? closeConfirmationHandler : null;
}

window.onunload = function() {
// if there's an event attached,
// it means that we confirmed,
// and the user agreed
if (window.onbeforeunload) {
alert( 'Unloaded !' );
}
};

setCloseConfirmation(true);

Good luck !

Yanick

Randy Webb wrote:
Yanick said the following on 9/3/2006 9:15 AM:
he**********@gmail.com wrote:
Hi all,
I am trying to get a way by which I'll know exactly when user goes out
of my site by clicking on close button in browser, So that w/e user
click close button in browser, I can send a signal to server.
This seems to be achievable with body unload events, but it is little
too much, as even if user navigate within my site, this event will be
generated, this can be avoided by handling onclick of each link, so
that I'll know exactly which link is clicked, but honestly this looks
over doing to me, any other smart short cut for finding out when user
click on X in browser?

TIA
Hemant
Except the body.onunload event/function, there's no other solution for
this.

The onunload event is not even close to a solution though. The
"solution" to the problem is to solve it on the server. Use Sessions and
Timeouts and your problem is solved.
May I suggest that you create a general function as this :

You can suggest it, but it still won't do what is requested.

Test your code, get the bugs out. Then load your page and then click the
Refresh button to reload the page....
(Untested !)

window.gotoLink( url, disconnect ) {

One of the problems with untested code is you don't find flaws such as
your "disconnect" flaw. It is never defined anywhere in your code so it
will always be undefined. If it is always going to have one state, there
isn't a whole lot of point in testing it is there?
// if disconnect is undefined or false
if ( !disconnect ) {
window.noUnloadWarning = true; // do not warn when unloading the
page
}

document.location.href = url; // use Javascript to load this url
into the current browser
};
// ....
window.body.onunload = function(e) {
// if window.noUnloadWarning is not set, it means that we're not
// refreshing the page with a new link, but the user tries to close
// the browser

That comment is utterly false and *very* misleading. There are other
ways to trigger the onunload without closing the browser.

Try clicking the Back button.....
<snip>
and call this function in all your anchors (<aelements) such as :

<a href="#"
onclick="gotoLink('http://www.blah.com&var=foo&var2=bar');">Click me
!</a>

That is even worse. It falls into the degradation problem where non-JS
browsers (or an error in the page) makes the page useless.

If you insist:

<a href="http://www.blah.com" onclick="return gotoLink(this.href)">My
Link</a>

Why do people insist on trying to make scripting harder than it is?

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Sep 4 '06 #5

P: n/a
Yanick said the following on 9/4/2006 11:40 AM:
Randy :

How nice of you to always point out other person's errors. It really
makes me feel like I tried, doesn't it ? I shall say that you post is
no better since it doesn't give any further solution to the problem.
It doesn't give any further solution because the solution doesn't lie in
client side scripting. The problem isn't detecting onunload - that is
trivial as you know. The problem is detecting *why* it was triggered and
you simply can't detect that.

Events that can trigger onunload:

Closing the Browser.
Closing the Tab (Tabbed Browsers).
Clicking a Link.
Submitting a Form.
Clicking a Button on the page that navigates away.
Clicking a Favorites.
Typing in a new URL.
Clicking the Forward/Back button.

That is not a complete list but just a sample.

Of those, you can deal with the third, fourth and fifth reasonably in
the page with scripting. The others you simply can not detect other than
the fact that the page is being unloaded.

It is an often enough asked question that it is in the group FAQ
although the section title it is in isn't the easiest to search for.

<URL: http://jibbering.com/faq/#FAQ4_29>

Which leads to this URL, which explains how to do it on the server:
<URL:
http://groups.google.com/group/comp.lang.javascript/msg/a0c582dc42c65fd2>
>Why do people insist on trying to make scripting harder than it is?

Maybe because some people insist on not giving them any examples with
clear solutions, but only conceptual suggestions... which, I may add,
are not always connected to the problem.
When you can't give a reliable solution then you there's not much point
in trying to come up with one. After you read questions like this a
kazillion times and explain it that many times you get jaded.
Like I said to you in an earlier post, I have no grief against you. I
believe that you are knowledgeable, and somewhat ressourceful. Though
everytime I read your posts, I can't help to feel that you're putting
down those you tried to help before you.
Maybe I need to change my demeanor and take a break from Usenet <shrug>
As for the solution proposed, for the two reasons that you have
mentionned :
1) javascript issues
2) back button that'd fire the unload event
It is clear that the solution had issues. But I still stick to my
suggestion :

To he**********@gmail.com (the OP) :

This is a (tested) solution. It doesn't fix your back/foreward button
(you don't know if the 'X' or close button has been clicked, or if the
user simply press 'Back' or 'Foreward'), but it's a start (taken from
http://www.webreference.com/dhtml/di.../bunload4.html,
http://pro-thoughts.blogspot.com/200...oad-event.html) :

// take all anchors and disable the confirmation box
// in their onclick events
Sidenote: You may want to look into adding the same type of
onclick/onsubmit event handlers to forms and buttons:

<button onclick="document.location....">
<input type="submit">

Also, I have seen code that looks like this:

<span onclick=""and <div onclick=""and <li onclick=""and it goes
on. Your code attempts to handle links but it can be made more
comprehensive but then it becomes overburdening to try to cover all the
possible ways to navigate away from the page.

The simplest solution to non A element onclicks is instead of setting
location properties, call a function that will cover the leaving of the
site.

Instead of this:

<button
onclick="document.location.href='http://www.google.com'">Google</button>

The page author would have to write it as such:

<button onclick="navigateAway('http://www.google.com')">Google</button>

And then have the navigateAway function set the unload flag.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Sep 5 '06 #6

P: n/a
Hello all,
Big Thanks for wonderful examples :)

Actually I already have timeout on server which is of around 20mins,
But since it is high traffic site, It was worth giving a shot about
available options, But with the amount of risk and efforts involved I
realy dont think it makes any sense doing sessiontime out on browser
close.

Randy Webb wrote:
Yanick said the following on 9/4/2006 11:40 AM:
Randy :

How nice of you to always point out other person's errors. It really
makes me feel like I tried, doesn't it ? I shall say that you post is
no better since it doesn't give any further solution to the problem.

It doesn't give any further solution because the solution doesn't lie in
client side scripting. The problem isn't detecting onunload - that is
trivial as you know. The problem is detecting *why* it was triggered and
you simply can't detect that.

Events that can trigger onunload:

Closing the Browser.
Closing the Tab (Tabbed Browsers).
Clicking a Link.
Submitting a Form.
Clicking a Button on the page that navigates away.
Clicking a Favorites.
Typing in a new URL.
Clicking the Forward/Back button.

That is not a complete list but just a sample.

Of those, you can deal with the third, fourth and fifth reasonably in
the page with scripting. The others you simply can not detect other than
the fact that the page is being unloaded.

It is an often enough asked question that it is in the group FAQ
although the section title it is in isn't the easiest to search for.

<URL: http://jibbering.com/faq/#FAQ4_29>

Which leads to this URL, which explains how to do it on the server:
<URL:
http://groups.google.com/group/comp.lang.javascript/msg/a0c582dc42c65fd2>
Why do people insist on trying to make scripting harder than it is?
Maybe because some people insist on not giving them any examples with
clear solutions, but only conceptual suggestions... which, I may add,
are not always connected to the problem.

When you can't give a reliable solution then you there's not much point
in trying to come up with one. After you read questions like this a
kazillion times and explain it that many times you get jaded.
Like I said to you in an earlier post, I have no grief against you. I
believe that you are knowledgeable, and somewhat ressourceful. Though
everytime I read your posts, I can't help to feel that you're putting
down those you tried to help before you.

Maybe I need to change my demeanor and take a break from Usenet <shrug>
As for the solution proposed, for the two reasons that you have
mentionned :
1) javascript issues
2) back button that'd fire the unload event
It is clear that the solution had issues. But I still stick to my
suggestion :

To he**********@gmail.com (the OP) :

This is a (tested) solution. It doesn't fix your back/foreward button
(you don't know if the 'X' or close button has been clicked, or if the
user simply press 'Back' or 'Foreward'), but it's a start (taken from
http://www.webreference.com/dhtml/di.../bunload4.html,
http://pro-thoughts.blogspot.com/200...oad-event.html) :

// take all anchors and disable the confirmation box
// in their onclick events

Sidenote: You may want to look into adding the same type of
onclick/onsubmit event handlers to forms and buttons:

<button onclick="document.location....">
<input type="submit">

Also, I have seen code that looks like this:

<span onclick=""and <div onclick=""and <li onclick=""and it goes
on. Your code attempts to handle links but it can be made more
comprehensive but then it becomes overburdening to try to cover all the
possible ways to navigate away from the page.

The simplest solution to non A element onclicks is instead of setting
location properties, call a function that will cover the leaving of the
site.

Instead of this:

<button
onclick="document.location.href='http://www.google.com'">Google</button>

The page author would have to write it as such:

<button onclick="navigateAway('http://www.google.com')">Google</button>

And then have the navigateAway function set the unload flag.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
Sep 5 '06 #7

This discussion thread is closed

Replies have been disabled for this discussion.