1

I have a div on my page (with set id) and a button that "opens"/"closes" it. By default this div is hidden (display: none).

Upon the click on the button I open/close the div and append or remove a hash tag to the url: window.location.hash = "#about_us_text"; or window.location.hash = ""; On each document load I check whether the hash tag is set so I can show the div right away if the URL was inputed with the hash tag:

if(window.location.hash == "#about_us_text") {
    $("a[href='#about_us_text']").trigger("click"); //trigger the click event which 'slides down' the div
    console.log("hash found");
}

This all works quite fine but there is a small problem I cannot resolve. If I open a new tab/window and I input the URL with or without the has, it works as intended. But if I open the page, let it load and then replace the URL within the same tab, the hash tag is not taken into consideration. E.g.:

  1. I open www.mysite.com/index.html -> no hash, div doesn't show => correct
  2. I replace the url in the same window/tab to www.mysite.com/index.html#about_us_text -> the page doesn't reload (document ready doesn't fire), div does not show despite the fact that it should.

Is there any way how to solve that the div is shown/displayed when the URL changes in the same window/tab? Thanks a lot!

Fygo
  • 4,555
  • 6
  • 33
  • 47
  • 1
    have a look at the [hashchange plugin](http://benalman.com/projects/jquery-hashchange-plugin/) which will fire an `hashchange` event – Arun P Johny May 19 '14 at 03:12
  • 1
    Also check this out: http://stackoverflow.com/questions/680785/on-window-location-hash-change – Tomjr260 May 19 '14 at 03:18

1 Answers1

-1

I found this handy. original post is here On - window.location.hash - Change?

$(window).on('hashchange', function() {
  //.. work ..
});
Hasan Badshah
  • 773
  • 1
  • 6
  • 16