Question

有没有办法阻止窗口位置哈希导致文档在IE10中“跳转”？下面的代码解决了Chrome和Firefox的问题。

if (location.hash) {
  setTimeout(function() {
    window.scrollTo(0,0);
  }, 1);
}

作为一个说明，我也尝试过jQuery的$(window)，但没有运气。

Answer 1

在与劳伦会面后，我们决定：

window.scrollTo(0,0)通过打开开发人员工具并运行命令在IE 10中运行。所以我们知道代码是孤立的，但是我们还有其他错误，或者页面上有代码阻止页面进入顶层。
作为一个快速黑客，我们将间隔从1毫秒增加到2000毫秒，看看它是否是竞争条件。这个工作但由于页面闪烁/跳跃而不可取。我们将值从2000毫秒降低到较低值，以最大限度地减少闪烁效应。
页面只有在第一次从不同的路径进入页面时才会滚动到顶部，而不仅仅是重新加载页面......或许页面上的其他一些JavaScript会导致不同的逻辑路径。

思想：

由于JavaScript执行速度慢，可能只发生在IE10中。其他浏览器可以更快地解析和解释JavaScript。
可以通过查询参数而不是锚点删除滚动，但会导致代码被重构，而不是那么漂亮的url路径。即https://<url>?tab-name=TabNameToSelect
可以通过服务器端或客户端路由删除滚动，但需要更大的开发工作量...路由可能具有{controller}/{action}/{tab-id}或{controller}/{action}/{item-id}/{tab-id}

快速修复解决方案：

// quick and dirty franken'fix
if (location.hash) {
  setTimeout(function() {
    window.scrollTo(0,0);
  }, 250);   // increment interval to "prevent" race condition
}

在IE10中阻止location.hash“跳跃”

1 个答案: