Solved

Detect when user clicks the Back button

Posted on 2008-10-30
5
566 Views
Last Modified: 2008-10-30
How do I do this in JavaScript?

It is not my intent to disable or interefere with this process.  In fact, it needs to work -- I just need to know when it happens is all.

Solution must work in IE and Mozilla, minimum.

Thanks!
0
Comment
Question by:knowlton
  • 2
  • 2
5 Comments
 
LVL 15

Accepted Solution

by:
Tomarse111 earned 480 total points
ID: 22842715
There is no JS method of physically detecting when the back button has been pressed unfortunately. The only method I could think of is by using some sort of cookie method on subsequently pages and then detecting if they exist on pages prior to the cookie creation / modification.

Looking around I found this script which does this sort of thing. This is not fool proof though, for example, a page redisplay from cache uses the same measured events, in the same order, as a "back" button click.

Have a play with it and see if it helps.


<script type="text/javascript">

<!-- Copyright 2007 Bontrager Connection, LLC

// http://BontragerConnection.com/
 

// Cookie's name may be changed.

var CookieName = "tempFocus";
 

// Change number of seconds if needed.

var PageLoadTimeSeconds = 3;
 

// Replace alert(...) in function HandleNewFocus(), below, 

//    with your custom "'back' button was clicked" handling.

function HandleNewFocus()

{

alert('It seems the "back" button was clicked.');

}
 

// No customizations required in the rest of this JavaScript.
 

var now = new Date();

var Milliseconds = parseInt(now.getTime() / 1000);

var CurrentCookie = new String();

var FocusLaunched = false;

var BackHandled = false;
 

function HandleCookie()

{

if(BackHandled) { return; }

BackHandled = true;

var beforemillis = parseInt(CurrentCookie);

if(beforemillis > 1) {

   var aftermillis = Milliseconds - beforemillis;

   if(aftermillis > PageLoadTimeSeconds) { HandleNewFocus(); }

	}

else { SetCookie('loaded'); }

}
 

function LoadFunctions()

{

CurrentCookie = GetCookie();

if(CurrentCookie == 'loaded') { return; }

HandleCookie();

SetCookie('loaded');

}
 

function Loaded() { LoadFunctions(); }
 

function Unloaded() { 

var again = new Date();

Milliseconds = parseInt(again.getTime() / 1000);

SetCookie(String(Milliseconds));

}
 

function Focused() {

if(FocusLaunched) { return; }

FocusLaunched = true;

LoadFunctions();

}
 

function SetCookie(v) {

CurrentCookie = v;

document.cookie = CookieName + '=' + v;

}
 

function GetCookie() {

var c_content = '';

if(document.cookie.length > 0) {

   var c_name = CookieName + '=';

   var c_begin = document.cookie.indexOf(c_name);

   var c_end = 0;

   if(c_begin > -1) {

      c_begin += c_name.length;

      c_end = document.cookie.indexOf(";",c_begin);

      if(c_end < c_begin) { c_end = document.cookie.length; }

      c_content = document.cookie.substring(c_begin,c_end);

      }

   }

return c_content;

}
 

window.onload = Loaded;

window.onunload = Unloaded;

window.onfocus = Focused;

</script>

Open in new window

0
 
LVL 5

Author Comment

by:knowlton
ID: 22842769
What about hooking into IE or Mozilla?  Don't these browsers expose an API to javascript?
0
 
LVL 36

Assisted Solution

by:Loganathan Natarajan
Loganathan Natarajan earned 20 total points
ID: 22842807
0
 
LVL 15

Expert Comment

by:Tomarse111
ID: 22842855
As far as i'm aware you cannot Hook into IE or FF to control or detect the back button natively through JS. The cookie method i think is your best bet (although not perfect) but one of the experts might tell you differently :)
0
 
LVL 5

Author Comment

by:knowlton
ID: 22842997
What about using Sessions?

Not to detect a back click, but to record where I  just was, and when I click the back button, where I am coming from to return to the last page I was on.
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
This article discusses how to create an extensible mechanism for linked drop downs.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

759 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now