location.hash and back history

javascript browser-cache hashcode
George Filippakos picture George Filippakos · Jul 13, 2012 · Viewed 19.2k times · Source

Is there a function that can be called to prevent the browser from recording a back history entry when changing the hash value?

I am writing a simple javascript gallery that changes the browser url without reloading the page as the user moves through each image.

This is done by setting the location.hash to the unique ID of the image.

window.location.hash = imageID;

The problem is when the user hits the browser back button, they must move backwards through every image like it was a page load.

If they rotated through 20 images using the gallery, they must click back 21 times to get back to the previous page.

How can I prevent a back history from being recorded with javascript?

Answer

jalbee picture jalbee · Jul 13, 2012

window.location.replace will let you set the url without adding it to the browser history.

var baseUrl = window.location.href.split('#')[0];
window.location.replace( baseUrl + '#' + imageID );

documentation

Related questions

Prevent browser caching of AJAX call result

It looks like if I load dynamic content using $.get(), the result is cached in browser. Adding some random string in QueryString seems to solve this issue (I use new Date().toString()), but this feels like a hack. Is there …

Read More
How do you cache an image in Javascript

My friends and I are working on a website where we would like to cache certain images in order to display them faster in the future. I have two main questions: How do you cache an image? How do you …

Read More
How to force reloading a page when using browser back button?

I need to somehow detect that the user has pressed a browsers back button and reload the page with refresh (reloading the content and CSS) using jquery. How to detect such action via jquery? Because right now some elements are …

Read More