Javascript: How do I change the URL in the address bar without refreshing the page?

Question

Possible Duplicate:
How do I, with JavaScript, change the URL in the browser without loading the new page?

I noticed that web apps like GMail and GrooveShark can change the URL in the address bar of my browser without refreshing the page. Ajax is obviously used to change the content. How can I change the URL?

`location.hash` https://developer.mozilla.org/en/window.location — Jim Schubert, Oct 23 '11 at 21:10

score 10 · Accepted Answer · answered Oct 23 '11 at 21:17

Gmail and Grooveshark only change the hash, this is done by changing:

location.hash = 'blah'

If you target HTML5 enabled browsers, you can use window.history.pushState and window.history.popState, see http://spoiledmilk.dk/blog/html5-changing-the-browser-url-without-refreshing-page

score 5 · Answer 2 · answered Oct 23 '11 at 21:15

5

You may want to look into HTML5 push state. I know iQuery Mobile is using this feature to modify the location URL without triggering a page load and it might be the right solution for you.

https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history

Here is an example of how it works:

window.history.pushState(data, "Title", "/new-url");

answered Oct 23 '11 at 21:15

Nick Clark

4,159
4
21
25

Note that firefox doesn't support title param (2nd), so use document.title = title. – 0fnt Feb 24 '15 at 06:37

Javascript: How do I change the URL in the address bar without refreshing the page?

2 Answers2

Linked