How to get the text after the # symbol in a link?

Question

I have a simple link with a hashtag in it. ie:

<a class="page_navigation" href="#something">click</a>

On clicking this, I would like to just end up with the 'something' part (minus the hash) in a var.

So far I have

$('.page_navigation').click(function(e)
{
    e.preventDefault();
    var href = $(this).attr('href');
});

Obviously I just end up with '#something' in my href var with the above code, and I understand I could do some kind of regex (not sure how yet) to strip the #, but I wonder if there is an easier way to access this part of the href I'm unaware of, without having to go through some find and replace code.

Any ideas?

Note: I also know I could store the 'something' in a data tag, but I'm trying to keep this code as DRY as possible.

jfriend00 · Accepted Answer · 2012-05-24T01:42:09.127

2

If you know it has a # in it, you can use this:

$('.page_navigation').click(function(e)
{
    e.preventDefault();
    var hash = this.href.replace(/^.*#/, "");
});

If you don't know whether it has one it it or not, you can use this:

$('.page_navigation').click(function(e)
{
    e.preventDefault();
    var hash = "";
    if (this.href.indexOf("#") {
        hash = this.href.replace(/^.*#/, "");
    }
});

In HTML5, you could use:

this.hash

but that is only for the latest browsers.

edited May 24 '12 at 01:42

answered May 24 '12 at 01:36

jfriend00

683,504
96
985
979

Correct me if I'm wrong, but I think it'd be a little bit nicer if you use `location.hash` in place of href.. .just incase somehow they have a `#` in the middle of the url somehow? – mazlix May 24 '12 at 01:38
@mazlix - `location.hash` only works on the page URL. This question is about an URL in a link. – jfriend00 May 24 '12 at 01:39
Doesn't your first one work even if there might not be a hash there? If there isn't the pattern won't match so nothing will be replaced. The second way won't work if the hash is the first character because `.indexOf()` would return 0. – nnnnnn May 24 '12 at 01:45
@nnnnnn - I was assuming the desired result if no hash is present is an empty string and the first one will return the entire URL in that case. – jfriend00 May 24 '12 at 01:49

score 1 · Answer 2 · edited May 23 '17 at 12:04

1

var theHash = $(this).prop("hash").substr(1);

Related answer to another question

edited May 23 '17 at 12:04

Community

1
1

answered May 24 '12 at 01:40

epascarello

204,599
20
195
236

Ayush · Answer 3 · 2012-05-24T01:45:33.930

0

You don't need regular expressions for this. You can simply do

var fragment;

if (window.location.hash) {
    fragment = window.location.hash;
}

Note that this will pick up the # symbol as well. So,

fragment = "#something"

If you don't want the # symbol, use substring like this:

fragment = window.location.hash.substring(1)

If you want to pick out the hash fragment from an anchor tag, you can do this:

var link = $('#yourAnchor').attr('href');
var fragment;
if (link.indexOf("#") !== -1) {
    fragment = link.substr(link.indexOf("#") + 1);
}

edited May 24 '12 at 01:45

answered May 24 '12 at 01:37

Ayush

41,754
51
164
239

-1 The OP is asking about a link in an `` tag, not the location of the current page. – jfriend00 May 24 '12 at 01:42
Oh, I missed that part. Editing answer – Ayush May 24 '12 at 01:43

score 0 · Answer 4 · answered May 24 '12 at 01:41

Demo http://jsfiddle.net/UR3XN/

code

$('.page_navigation').click(function(e)
{
    e.preventDefault();
    var href = $(this).attr('href');
    var equalPosition = href.indexOf('#'); //Get the position of '#'
    var withouthash = href.substring(equalPosition + 1); 
    alert(withouthash);
});

How to get the text after the # symbol in a link?

4 Answers4