Javascript detect variable change after # in address bar

Question

Example:

http://localhost/#view=1

If I want to get that variable "view", I need to get window.location.href , and then split the # and do something more.

This is my question:

<a href="#view=1">View 1</a>
<a href="#view=2">View 2</a>

Is there anyway to detect when View 1 click or view 2 click? For people click on View 2, a function will do for view=2 .

OR I must do something like this:

<a href="#view=1" onclick="setview(1);">View 1</a>
<a href="#view=2" onclick="setview(2);">View 2</a>

I want when people copy the link http://localhost/#view=2 and send to there friend, the function setview(2) will be run when their friend visit the URL, and they don't need to click the link.

Answer 1

You can use hashChange event

$(function(){
  // Bind the event.
  $(window).hashchange( function(){
    // Alerts every time the hash changes!
    alert( location.hash );
  })

  // Trigger the event (useful on page load).
  $(window).hashchange();
});

And now in the $(window).hashchange(); function, put your code:

$(window).hashchange(function(){
  $(location.hash).show();
});

In your case, it would be:

$(window).hashchange(function(){
  setview(location.hash[strlen(location.hash)-1]); // Get the last character, if this doesn't work.
});

Forgot to add the plugin: http://benalman.com/projects/jquery-hashchange-plugin/ , which you would need to use.