清空window.location.hash时如何避免滚动到页面顶部答案

【问题标题】：How to avoid scrolling to the top of the page when emptying window.location.hash清空window.location.hash时如何避免滚动到页面顶部
【发布时间】：2011-04-26 17:00:20
【问题描述】：

为什么下面的代码会让滚动条跳转到页面顶部？

window.location.hash = ''

有没有办法在不跳转到页面顶部的情况下清空它？

【问题讨论】：

这是一个副本：stackoverflow.com/questions/4715073/…

标签： javascript

【解决方案1】：

window.location.hash 跟踪页面上的当前锚点位置。当您将其设置为锚点时，页面将自动转到该锚点。当您删除它时，页面将转到页面顶部的“空白”！

要解决此问题，请执行以下操作：

var scrollPosition = window.style.scrollTop;
window.location.hash = '';
window.style.scrollTop = scrollPosition;

【讨论】：

感谢您的回答。顺便说一句，如果您将代码块缩进四个空格，它会被格式化并且更易于阅读。
在 Firefox 中，我得到“window.style 未定义”。我决定放弃它并使用 jQuery 的$(window).scrollTop();，因为我可以访问它。
document.body.scrollTop 或 window.scrollTop 可能更正确。
我喜欢在 Javascript 中，事情或多或少是正确的。

【解决方案2】：

当我编写的代码中出现一个错误时，我遇到了这种行为，该错误位于 setInterval 上观察哈希。

setInterval(function(){
  var match = hash.match(/myValue=([^&]+)/);
  window.location.hash = '';
  if (match && match.length == 2) {
    $('#myDiv').val(match[1]);
    // RUN CODE
  }
}, 250);

在 Chrome 中，此代码不会导致任何问题，但在 Internet Explorer 和 Firefox 中，它不会让您滚动，因为它总是试图滚动到页面顶部。

当然，上面的代码无论如何都是“错误的”，因为只有在找到匹配项时才会清除哈希。遗憾的是，我是在 Firefox 中检查后才发现这个错误的。

【讨论】：