Question

我有一个滚动插件，它使用我的div ID滚动到特定的锚点

创建这样的网址：http://example.com/#examplediv|700

我想找到一种方法，使用js或任何其他建议的方法来隐藏url中的哈希

我希望将此http://example.com/#examplediv|700转换为：http://example.com/

有什么想法吗？

Answer 1

哈希位于location.hash属性中。只需将其设置为空字符串即可。如果您需要在其余代码中使用它，可以先将它保存在另一个变量中。

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

Answer 2

你可以修改你正在使用的滚动插件，也可以自己添加它，但你会想做这样的事情：

假设：您关注此滚动的所有DIV都需要anchor-scrolls类。

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);

Answer 3

您可以将其删除，保存并滚动到具有相同效果的锚点。

// 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);

});

但仅适用于同一页面的锚点。如果锚点在不同的页面怎么办？

如何使用js隐藏URL中的#hash

3 个答案: