Q:

Updating URL hash without page reload

<script>
function CurHash(){
    var id = parseInt(window.location.hash.replace("#", ""));
    alert(id);
}
</script>

<!-- START URL: test.htm#1 -->
<a href='#1' onClick='CurHash()'>#1</a>
<a href='#2' onClick='CurHash()'>#2</a>
<a href='#3' onClick='CurHash()'>#3</a>

If we are now on test.htm#1 and click link #2, alert shows 1 number, not 2, and after this hash in URL is changed to 2. When you next click 3, it will show prevouse 2, and so on.
There is the problem for me, because I use hash for scrolling my page content on fixed height (can't use anchors due to architecture issues), and with such behavour after clicking link scroll will happened only on second click, what is completely wrong.
QUESTION: How can I update hash and take updated (not previouse) value for further use, without reloading page in browser (all content for scrolling already on page, reload it from server isn't good solution).

A:

Not exactly cross browser, but you can get cross browser hashchange workarounds if you want,
<script>
$(window).on('hashchange load',function(){
    var id = parseInt(window.location.hash.replace("#", ""));
    alert(id);
});
</script>

<!-- START URL: test.htm#1 -->
<a href='#1'>#1</a>
<a href='#2'>#2</a>
<a href='#3'>#3</a>

using bind:
http://jsfiddle.net/KdqWK/1/
using on:
http://jsfiddle.net/KdqWK/2/

