从 URL 中删除哈希答案

【问题标题】：Removing hash from URL从 URL 中删除哈希
【发布时间】：2012-04-19 01:15:45
【问题描述】：

在使用 window.location.hash='' 页面从 URL 中删除哈希后，在 firefox 中重新加载。

编辑

例子：

wwww.Mysite.come/#page=1

单击按钮后，我将使用以下代码删除哈希值

window.location.hash=''

删除哈希页面后，Firefox 会重新加载。

我不想重新加载页面我只想从 URL 中删除哈希

如何解决？

【问题讨论】：

很抱歉，您的问题没有意义。你能澄清一下并展示一些代码示例吗？
为什么要删除哈希？
我提交了 ajax 表单，页面的一部分正在发生变化。在这一步之后，哈希值没有意义，这就是我要删除它的原因
可能重复：stackoverflow.com/questions/269044/…

标签： jquery browser cross-browser

【解决方案1】：

以防万一其他人仍在寻找解决方案。页面加载时试试这个。

history.pushState("", document.title, window.location.pathname);

【讨论】：

【解决方案2】：

来自https://developer.mozilla.org/en/DOM/window.location：

示例

每当修改位置对象的属性时，文档将使用 URL 加载，就好像 window.location.assign() 已经使用修改后的 URL 调用。

我认为这个问题解决了你想要使用 jQuery 的问题：

Change hash without reload in jQuery

How to remove the hash from window.location with JavaScript without page refresh?

How can I change Firefox window.location.hash without creating a page reload?

【讨论】：

【解决方案3】：

如果我理解正确，

<a href="#someElementID" id="myLinkName">Some Text</a>

在浏览器中单击上述链接通常会在地址栏中添加一个哈希，例如 www.websitename.com#someElementID 防止的，是吗？

我刚刚测试的有效且不刷新页面的解决方案是：

event.preventDefault();

这适用于“click()”事件，该事件涉及链接到元素 id 的锚标记，例如上面的锚标记示例。实际上，它在您的“click()”事件中看起来像这样：

<script>
    $('#myLinkName').click(function(){
        event.preventDefault();
        //the rest of the function is the same.
    });
</script>

现在，单击同一链接会在地址栏留下相同的 URL www.websitename.com，而单击锚点时不会添加散列。

【讨论】：

【解决方案4】：

我们可以通过在 click 函数中返回 false 来移除/逃避附加哈希。

<script>
    $('#add_user').click(function(){       
     //your custom function code here..
    return false;
});
</script>

<a id="add_user" href="#">Add Card</a>

【讨论】：

【解决方案5】：

您会发现来自w3schools 的这个示例对您的需要非常有用，而且它为您提供了与所有浏览器兼容的优雅滚动移动，请查看以下代码：

  // Add smooth scrolling to all links
  $("a").on('click', function(event) {

// Make sure this.hash has a value before overriding default behavior
if (this.hash !== "") {

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

    // Store hash
    var hash = this.hash;

    // Using jQuery's animate() method to add smooth 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, function(){

      // Add hash (#) to URL when done scrolling (default click behavior)
      // obvously you will ignore this step because you want to remove the hash in first place - but just in case you want turn it on again

      window.location.hash = hash;
    });
   } // End if
  });
});

【讨论】：