Read and process hash tag URL
September 17th 2012
2797

Today we will show you how to read the part of URL following after the hash tag and process it to the specified function. Using hash tag links is a popular practice between AJAX calls based websites as hash tag URL extension can be easily changed without reloading the page. 

Kartogram uses slightly ’reveresed ingeneering’ methods for such practice as each link, once clicked is updating hash tag URL part to mark the action that is being taken. Also it fires up the jQuery call assigned to that particular link hence avoiding repeated URL reading for hash tag part change. 

Following this scenario from the other end, once such link is clicked it would open the landing page and would not react to the hash tag link extension as browsers are normally not paying attention to the bit after ’#’. Unless the specific javascript function is in place to read the URL on page load and then process what’s required depending on that magic # bit.

Following function needs to be called on window load:

As you see we read the hash part of the URL and pass it to the function called ’processhash’:

As you see we used switch function to switch possible hash tag parts and fire up adequate functions. Those functions can be absolutely anything, from showing some hidden divs to AJAX calls to load some database based content.

For a quick example follow the link and check all the link bits explained above: http://www.kartogram.co.uk/#!what-we-do

If you read our previous post you already know how to avoid browser refresh once such link is followed from the external souce.

So get coding and as usual, should you need any further information feel more than welcome to use the comments section below or contact us directly at blog@kartogram.co.uk .

Regards,

SD

Back To Blog