Implement a new history record without changing the URL. Like google maps

Question

I am trying to find a better approach so as not to break the back button in my javascript application.

In my research, I try to understand what the current state is. So I turned to Google maps to see how it works.

It has back / forward functions, but it does not change the url when creating a new history record. Try going to http://maps.google.com/ , type NY and hit enter. Now use the back button. No URL change.

How do they do it? I tried to figure this out, but it’s not easy for me to get through the outdated documentation about JavaScript history and IE6 tips.

Answer 1

Create a new history entry:

location.hash = 'new_history_entry';

Creating a history record:

location.replace('http://no/new/history/entry');

Google maps use frames. To test it, run HttpFox. You will get an HTML page with javascript. You can analyze it yourself or just believe me that it works with frames.

Answer 2

Answer Lekensteyn will not add back / forward buttons in IE6, for this you need a frame. The jQuery story uses the onhashchange event if the browser supports it (all modern browsers do), if it does not add the necessary support back (i.e. the needs of iframes, firefox 1, ie7, etc., interval checks are just needed).

Answer 3

- YUI