Checking and adding on to URL hash using window.location.hash

Question

Right now if I have multiple links using:

Options 1:
<a href="javascript:;" onClick="window.location.hash+='A'">Option A</a>
<a href="javascript:;" onClick="window.location.hash+='B'">Option B</a>
<a href="javascript:;" onClick="window.location.hash+='C'">Option B</a>

Options 2:
<a href="javascript:;" onClick="window.location.hash+='1'">Option 1</a>
<a href="javascript:;" onClick="window.location.hash+='2'">Option 2</a>
<a href="javascript:;" onClick="window.location.hash+='3'">Option 3</a>

Options 3:
<a href="javascript:;" onClick="window.location.hash+='X'">Option X</a>
<a href="javascript:;" onClick="window.location.hash+='Y'">Option Y</a>
<a href="javascript:;" onClick="window.location.hash+='Z'">Option Z</a>

Whenever clicking any of these, it will keep adding to the URL. Is there a way to check if a current hash already exists (ie. if third character in hash string, then replace with current hash). Any help would be great thanks! I'm trying to accomplish an end result which looks like below even if the user went back and forth between selecting options:

http://mydomain.com/question-page#A3Y

Omiod · Accepted Answer · 2014-03-07 13:42:10Z

3

change it to += to concatenate:

window.location.hash+='A';

I would do something like the following:

first, create variables for each of the possible options:

var option1 = "";
var option2 = "";
var option3 = "";

next, create a function that will set the hash:

function generateHash() {
  window.location.hash = option1 + option2 + option3;
}

finally, just set each of those options in the onclick event, as well as generating the hash:

<a href="javascript:;" onClick="option1 = 'A'; generateHash();">Option A</a> 
 ...
<a href="javascript:;" onClick="option2 = '1'; generateHash();">Option 1</a>
...
<a href="javascript:;" onClick="option3 = 'X'; generateHash();">Option X</a>

edited Mar 7, 2014 at 13:42

Omiod

11.7k11 gold badges56 silver badges59 bronze badges

answered Jan 18, 2013 at 3:03

kennypu

6,1332 gold badges24 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

taylor Over a year ago

that works, although is there a way to check for a current hash and replace if it exists? The problem is in my example above someone could select all 3 of an option and it'd just keep adding to the URL

kennypu Over a year ago

then you should run that through a function that will do the replacing. side note, you have jquery tagged, but you don't have jquery in your post so you should remove that tag.

taylor Over a year ago

sorry, editted it out. I thought jquery might have a solution I needed.

kennypu Over a year ago

i changed the answer, should be what you're looking for

taylor Over a year ago

This updated answer accomplishes exactly what I was trying to do, perfect. Huge thanks!

Collectives™ on Stack Overflow

Checking and adding on to URL hash using window.location.hash

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related