javascript - How do you change the URL in the address bar without reloading the page? - Stack Overflow

admin管理员组

文章数量:1326333

How does Shopify do this? Go to their website, click on the Features link and you'll see that the URL in your browser's address bar says:

Then click on any of the sub links and you'll see that the URL in the address bar changes without using a hash and there is no page flip.

I don't think they are using ajax to change the content because it all appears to be included in hidden divs on the page, but regardless, you can apparently change the URL using client side tricks. Your help is appreciated?

How does Shopify do this? Go to their website, click on the Features link and you'll see that the URL in your browser's address bar says:

http://www.shopify./tour/sell-online

Then click on any of the sub links and you'll see that the URL in the address bar changes without using a hash and there is no page flip.

I don't think they are using ajax to change the content because it all appears to be included in hidden divs on the page, but regardless, you can apparently change the URL using client side tricks. Your help is appreciated?

• javascript
• url

Share Improve this question Follow asked Nov 16, 2012 at 18:10 Julian DormonJulian Dormon 1,77955 gold badges3333 silver badges6363 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 9

You use the new HTML5 history API to push a new state.

Here's the MDN documentation and a good tutorial.

Beware that doing this is often painful (you have to manage correctly the state of your application) and it doesn't work with IE9. It's almost always bined with ajax : it's the solution to let dynamically loaded content be bookmarkable even while the whole page isn't reloaded or changed.

Look into pushState, but be aware it's not supported in all browsers.

本文标签： javascriptHow do you change the URL in the address bar without reloading the pageStack Overflow