javascript - How to hide # hash in a url using js - Stack Overflow

admin管理员组

文章数量:1425717

I have a scroll plugin that uses my div ID to scroll to a specific anchor,

It's creating urls like this: |700

I want to find a way using js or any other suggested method to hide the hash in the url

I want to transform this: |700 into this: /

Any ideas?

I have a scroll plugin that uses my div ID to scroll to a specific anchor,

It's creating urls like this: http://example./#examplediv|700

I want to find a way using js or any other suggested method to hide the hash in the url

I want to transform this: http://example./#examplediv|700 into this: http://example./

Any ideas?

• javascript
• jquery
• html
• css
• url-rewriting

Share Improve this question Follow edited Mar 12, 2015 at 3:48 Barmar 784k5757 gold badges548548 silver badges659659 bronze badges asked Mar 12, 2015 at 3:45 BANGOBANGO 5722 silver badges99 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 2

You can remove it, save it and scroll to the anchor, which has the same effect.

// Add smooth scrolling to links
$(".anchor-link").on('click', function(event) {

 // Prevent default anchor click behavior
 event.preventDefault();

 // Store hash
 var hash = this.hash;

 // Using jQuery's animate() method to add page scroll
 // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
 $('html, body').animate({
   scrollTop: $(hash).offset().top
 }, 800);

});

But works only for anchors at the same page. What if the anchor is at a different page?

You can either modify the scroll plugin you are using or add it yourself on the side but you will want to do something like this:

Assumption: All DIVs that you are concerned with regarding this scrolling will need to have the anchor-scrolls class.

HTML

<a href="#anchor-hash" class="anchor-scrolls">foo</a>

JS

//using jQuery
(function($){
   $('.anchor-scrolls').on('click', function(evt){
      evt.preventDefault(); //prevents hash from being append to the url
   });
)(window.jQuery);

The hash is in the location.hash property. Just set it to the empty string. If you need to use it in the rest of your code, you can save it in another variable first.

var saved_hash = location.hash;
location.hash = '';

本文标签： javascriptHow to hidehash in a url using jsStack Overflow