jquery - 当 Backbone 中的 hashchange 触发时，使用 jquery 滚动窗口无法设置动画

Question

我有一个基本上看起来像这样的函数：

function scroll(scrollTop) {
  $("body,html").animate({scrollTop: scrollTop});
}

在主干路由中，我尝试使用此功能滚动到页面上的某个位置，再次简化：

var Router = Backbone.Router.extend({
  routes: {
    "": "index",
    "foo": "foo"
  },

  index: function () {
    scroll(0);
  },

  foo: function () {
    scroll($("#foo").offset().top);
  }
});

这在页面加载（如果加载“/foo”）、手动调用函数或使用 pushState（而不是哈希片段）路由时效果很好。

但是使用哈希片段路由，动画会失败。滚动位置仍然会发生变化，但会立即发生变化，没有动画。

有解决方法吗？

Answer 1

您所描述的实际上是浏览器在更改主题标签时的行为。也就是说，从domain.comto导航domain.com#someId就像是让浏览器“关注”页面中 id 为 的元素someId。所以窗口将移动到这个元素。不幸的是，我不知道有什么解决办法。

您可能想查看我在搜索可能的解决方案时发现的这个讨论：修改 document.location.hash without page scrolling。