Easy Java Script Code to Disable the Browser Back Button
By Stephen Bucaro
One of the most common questions asked about Web coding is "how do I disable the
browser Back button". Why anyone would want to annoy their Web site's visitors
by taking control away from them is another question. Let's assume that you have
a legitimate reason for disabling the back button. Maybe you need to restrain
the user within a multi-page form. In this article, I show you how to disable
the browser's Back button with a only few lines of Java Script code.
First lets discus a few preliminaries:
• There is no way to disable the browsers Back button. The only real way to do it is
to open the same webpage in a new window with the entire toolbar (and possibly the Address bar too)
removed, then close the users original browser window.
• Even with the Back button disabled, it's very easy for a user to leave your Web site.
They need only to enter a URL in the browsers Address text box. If you take away their browser's
Address text box, they need only open a new browser window.
In this article I show you how to restrain the user within a three-page Web site.
When the user tries to leave via the browsers Back button, the first page that the
user visited when they arrived at the Web site is reloaded.
The History Object
The Back and Forward buttons are related to the browser's history object. As the
user surfs the Web, the history object maintains a list of the URLs they visited.
For security reasons, there is very little you can do with the history object, for
example you can't examine the URL's of the previous websites that the user visited.
• Using Java Script to Disable the Back button for only a single page is incredibly easy,
just use the BODY tag code shown below.
<body onunload="javascript:history.go(1)">
• In older browsers the history object's methods had bugs or performed differently than they
do in modern browsers.
To disable the Back button, we could monitor the index of the current location
in the history list, and if the index was equal to it's value when they first
arrived at our Web site, we could disable the back button. Unfortunately the
history object has no accessible index property.
We will create our own "history" index. The first thing we need is a place to store the index.
• We could store the index in a cookie on the users computer, but some users have cookies disabled.
• We could store the index in a server-side session variable, but here's a wake-up call for
some programmers. Session variables stored on the server-side depend upon a cookie
stored on the users computer. The session variables themselves are not stored in a
cookie on the user's computer, but the session ID is, and without the session ID,
there is no session. If you don't believe it, see how your session variable dependant
application works with a cookie disabled browser.
• We could store the index in a frame. Some webmasters don't like to use frames because your main
content frame can be hijacked and displayed on someone else's website. However there
are ways to prevent that.
• We could store the index by appending it to the URL string. This makes it visible to the user,
but that's not a problem, especially since few users have a clue as to what that stuff
attached to the end of the URL string means. This is the method we will use in this example.
| 
About BTH
User Agreement
Privacy
Site Map
Contact
News Feeds
RSS Feed
Follow @Stephen Bucaro
General Web Design
