在BackboneJS中渲染视图并滚动到顶部

Question

当我在BackboneJS中渲染视图时，我只需要替换我的容器的html：$('#container').html(this.template())并且它工作正常，但是当用户向下滚动页面并按下呈现其他视图的按钮时，他的“滚动位置”遗骸和同一个地方，产生了糟糕的用户体验。

我想要实现的是：当呈现新的骨干视图时，用户应该看到页面的顶部（如果单击普通链接会发生什么，这会将您带到另一个页面重新加载页面）。

我怎样才能做到这一点？

Answer 1

有几种方法可以做到这一点，这里有一些基本的例子可以帮助你入门。

在按钮的单击侦听器中，您可以添加window.scrollTo（0,0）或$（window）.scrollTop（0）;滚动到页面顶部。

或者您可以将此滚动触发方法直接放在视图渲染回调中：

render: function() {
    $(window).scrollTop(0);
    return this;
}

或者，如果您的视图实际上是在触发新路线，您还可以侦听该网址的更改，然后触发滚动。

var router = new AppRouter();
router.on("route", function () {
    $("html,body").scrollTop(0);
});