Get hash value from url

Question

I'm trying to get the hash value after a link was clicked. Any ideas?

e.g.

The Link

index.html#needThis

This is my result:

index.htmlneedThis

How can I remove the 'index.html' ?

$('#myselector').on('click', 'a', function(){
    var hash = $(this).attr('href').replace('#', '') //get url
    console.log(hash);
})

Possible duplicate of stackoverflow.com/questions/1822598/…. You don't need to 'remove' the index.html, you need to grab only the hash. — Nadav S.
– Nadav S., Commented Nov 12, 2012 at 13:08
Why al all answers using $(this).attr('href')?! Use native JS where possible: this.href has the exact same value, withouth the need for another library or function calls. — Martijn
– Martijn, Commented Aug 25, 2016 at 10:27

Gabriele Petrioli · Accepted Answer · 2014-05-13 19:48:22Z

71

update

Modern browsers (not sure how back it goes) can extract the hash directly from anchor elements (so i added #5)

Take your pick ..

var hash = $(this).attr('href').split('#')[1];
var hash = $(this).attr('href').replace(/^.*?#/,'');
var href = $(this).attr('href'), hash = href.substr(href.indexOf('#')+1);
var hash = $(this).attr('href').match(/#(.*$)/)[1];
var hash = this.hash.substr(1);

update

Just revisited this and i believe that #2 can be improved to

$(this).attr('href').replace(/^.*?(#|$)/,'');

This way if no hash exists it will return empty instead of the whole url..

edited May 13, 2014 at 19:48

answered Nov 12, 2012 at 13:08

Gabriele Petrioli

197k35 gold badges275 silver badges331 bronze badges

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

4 Comments

Bellash Over a year ago

The second is the perfect solution! No Exception : var hash = $(this).attr('href').replace(/^.*?#/,''); thank you @Gaby

Tobias Oberrauch Over a year ago

@gaby what is test in the 3. solution?

Gabriele Petrioli Over a year ago

@TobiasOberrauch, great eyes... I have corrected it ... (it was supposed to be a temporary reference to the href string)

Gabriele Petrioli Over a year ago

@Bellash just posted an improvement to it :)

score 16 · Accepted Answer · 2012-11-12 13:11:04Z

16

Just use var hash = window.location.hash.

It returns everything after #

Or if you've got a variable which contains an url:

$(this).attr('href').substring($(this).attr('href').indexOf('#'))

edited Nov 12, 2012 at 13:11

answered Nov 12, 2012 at 13:05

user1796666

3 Comments

grindking Over a year ago

Thank you for that but it's not working in my case because I need the href of the a-element which is triggered and not from the current url. :)

user1796666 Over a year ago

in that case use a.substring(a.indexOf('#'))

Robo Robok Over a year ago

window.location.hash doesn't actually return everything after #, but everything starting from #, so # character is included.

Wasim Shaikh · Accepted Answer · 2012-11-12 13:08:04Z

5

You can try with window location hash.

$('#myselector').on('click', 'a', function(){
    var hash = $(this).attr('href').replace('#', '') //get url
    var hash2 = window.location.hash ;
    console.log(hash2);
})

answered Nov 12, 2012 at 13:08

Wasim Shaikh

7,07818 gold badges63 silver badges88 bronze badges

1 Comment

grindking Over a year ago

Thank you but the same problem as above.

jucedogi · Accepted Answer · 2016-02-08 17:51:18Z

2

Why not simply use:

window.location.hash

Works just fine for me.

answered Feb 8, 2016 at 17:51

jucedogi

464 bronze badges

Comments

Muthu Kumaran · Accepted Answer · 2012-11-12 13:10:47Z

1

Try this,

$('#myselector').on('click', 'a', function(){
    var url = $(this).attr('href') //get url
    var arr = url.split('#');
    alert(arr[0]); //URL without hash #
    var hash = arr[1];
    console.log(hash);
})

answered Nov 12, 2012 at 13:10

Muthu Kumaran

18k5 gold badges50 silver badges72 bronze badges

Collectives™ on Stack Overflow

Get hash value from url

5 Answers 5

4 Comments

3 Comments

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

4 Comments

3 Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related