Potential problems setting window.location.hash

Question

I have some javascript code which, at one point, sets window.location.hash to a specific string. This works fine in Firefox 3, but I want to know if I will run into problems with this later, i.e. is this a cross-browser solution (IE6 included)?

Also, I am using ReallySimpleHistory. Will this mess up its internal state?

Thanks

Rubyeruch

Answer 1

window.location.hash has been around since JavaScript was introduced in Netscape Navigator 2 back in 1995. It was first supported by Microsoft in Internet Explorer 3 in 1996. I think you can be reasonably certain that every JS-capable browser supports it.

From a quick glance through the source, it looks as if ReallySimpleHistory makes pretty extensive use of this property, so you may well break it. You might want to use its add(newLocation) method instead (which works by setting window.location.hash).

Slipper

Thanks. I was avoiding the add() method on purpose because I foolishly wanted to avoid setting a history point, but this turns out to be impossible – Rubyeruch

Answer 2

Get:

 var hash = location.hash.slice(1);

Set:

 location.hash = '#' + 'string';

Showpiece

Why not just use the location.hash property? That's what it's for, and as it's been around since Netscape Navigator 2 (1995) you can bet it's supported everywhere. – Slipper

I Updated the answer to use location.hash instead of location.href, and .slice(1) instead of .split[1] which is more bulletproof. – Deficient

Note, some browsers require the preceding '#' when setting the hash. Simply setting window.location.hash = 'foo' will result in example.com/foo rather than example.com/#foo. – Actinozoan

Answer 3

Old thread i know, but window.location.hash is subject to a size limit as well. If you're passing large amounts of data, and want to save state in the hash, you could run into some issues.

IE will give you the error: SCRIPT5 - Access denied. if you try to assign a hash that is over the limit which is super useful.

Just food for thought.

Deletion

Thanks, very helpful. When trying to enter the url directly in the IE, if it is too long, it is "simply" cut... – Grindstone

Awesome info. That is the issue I'm experiencing. – Postdiluvian

Thanks! That was exactly our problem. Too bad that the error message gives so few details. First we searched a long time for the error in other places like the LocalStorage. – Roughneck

Answer 4

All "modern" (a.k.a A-Graded) browsers allow to set hash and do not reload the page when doing so. The ones that do reload the page are some of the older ones, such as Safari 2.0.4 and Opera 8.5x.

See my Usenet post on comp.lang.javascript where I explain it in a bit more detail.

Also note, that HTML5 finally specifies that hash setter should change actual hash but not reload the page.

Column

Answer 5

Setting window.location.hash works fine in IE6 & IE7.

In some occasions, reading window.location.hash under IE6 right after a set will return the old value, but the browser has set the hash successfully. An example:

alert(window.location.hash);
window.location.hash = '#newHash';

/* Sometimes, it will return the old value,
   I haven't figured out why it does that, and
   it's rather rare. */
alert(window.location.hash);

If you are just using it to set it, you shouldn't run into any problems.

Dint