I am trying to find the string after the my hash sign so when the user reloads the page I can just look at that string and then load the correct page dynamically. My url looks like this !/account/. How do I retrieve just the /account/? I have tried using this:

var oldLoc = window.location,
patt = /#!(.+)/,
newLoc = oldLoc.match(patt)[1]; // This returns `/account/settings`

if (newLoc == '' || newLoc == '#!/' || newLoc == '/#!' || newLoc == '/#!/') {
    $('#reload_section').load('main.php');
} else if (newLoc == '/newsfeed/') {
    $('#reload_section').load('newsfeed.php');
} else if (newLoc == '/account/') {
    $('#reload_section').load('account.php');
} else if (newLoc == '/search/') {
    $('#reload_section').load('ajaxsearch.php');
}

This works fine if I put a value like !/account/ inside the oldLoc variable but if I put what I have it gives me this error:

TypeError: 'undefined' is not a function (evaluating 'oldLoc.match(patt)')

1)Why doesn't this work, I have tried all different binations window.location, document.location, nothing works.
2) Is there an easier way to find what the hash is of the page and then load the correct page as shown above?

Thanks!

I am trying to find the string after the my hash sign so when the user reloads the page I can just look at that string and then load the correct page dynamically. My url looks like this http://mysite./#!/account/. How do I retrieve just the /account/? I have tried using this:

var oldLoc = window.location,
patt = /#!(.+)/,
newLoc = oldLoc.match(patt)[1]; // This returns `/account/settings`

if (newLoc == '' || newLoc == '#!/' || newLoc == '/#!' || newLoc == '/#!/') {
    $('#reload_section').load('main.php');
} else if (newLoc == '/newsfeed/') {
    $('#reload_section').load('newsfeed.php');
} else if (newLoc == '/account/') {
    $('#reload_section').load('account.php');
} else if (newLoc == '/search/') {
    $('#reload_section').load('ajaxsearch.php');
}

This works fine if I put a value like http://mysite./#!/account/ inside the oldLoc variable but if I put what I have it gives me this error:

TypeError: 'undefined' is not a function (evaluating 'oldLoc.match(patt)')

1)Why doesn't this work, I have tried all different binations window.location, document.location, nothing works.
2) Is there an easier way to find what the hash is of the page and then load the correct page as shown above?

Thanks!

• javascript
• jquery

• I've rolled back your edit; solutions should be posted as answers to the question, not as part of the question. – yoozer8 Commented Apr 4, 2013 at 18:49

5 Answers 5

Use window.location.hash. For the URL http://mysite./#!/account/, it will return #!/account/. Now, simply take the #! off of the front with a regular expression:

window.location.hash.replace(/^#\!/,"")

The above code will give you /account/.

EDIT: You could also use this:

window.location.hash.substring(2)

you can use

window.location.hash

The window.location object has a hash property which contains everything after (and including) the has symbol. To get everything after the #, take off the leading hash symbol:

window.location.hash.substring(1)

Also consider taking a look at some JavaScript routing libraries like,

• Crossroads.js (only routing)
• Backbone.js (provides general client-side app structure which includes a helpful router with pushState support)

You might try taking a look at the Crossroads and Hasher libraries. You can put them together to do what I think you're trying to do.

// setup your routes
crossroads.addRoute('newsfeed.php', function() {
    // do some stuff
});

//setup hasher
hasher.initialized.add(crossroads.parse, crossroads); //parse initial hash
hasher.changed.add(crossroads.parse, crossroads); //parse hash changes
hasher.init(); //start listening for history change