CODEWITHSUNDEEP
javascriptjqueryhtmlurlhashtag
Dchris
Dchris

Reputation: 3057

Remove hashtag(#) from url

I want hash-tags to be removed from URL after they are used. For example, when i click on the link below:

<a href="#btnq1"><button type="button" name="" value="" id="btnq1">Just a button</button></a>

I want the hash-tag #btnq1 that appears to the URL of the page to be removed just after the action on this link happens. I tried the below jquery code with no success:

$('#btnq1').click(function(event){
   event.preventDefault();
   // your action
});

And even if this works, then how do i implement it to work for every hash tag that is added to the URL? I would like to solve it using javascript.

Upvotes: 3

Views: 15385

Answers (2)

Honorable Chow
Honorable Chow

Reputation: 3153

first add a class to your a tag that you want this behavior for, or a html 5 data- attribute. Then your link becomes;

<a href="#btnq1" class="remove-hash"><button>Button</button></a>

$('body').on('click', ".remove-hash", function(e){
    $(this).removeAttr('href');
});

Upvotes: 0

A. Wolff
A. Wolff

Reputation: 74420

You could try that:

$(window).on('hashchange', function(e){
    history.replaceState ("", document.title, e.originalEvent.oldURL);
});

Upvotes: 7

Related Questions