我正在写一个模态弹出窗口,我需要浏览器跳转到屏幕的顶部,当打开模态按钮被按下。是否有一种方法可以使用jQuery将浏览器滚动到顶部?


当前回答

Vanilla Javascript解决方案

theId.onclick = () => window.scrollTo({top: 0})

如果你想平滑滚动

theId.onclick = () => window.scrollTo({ top: 0, behavior: 'smooth' })

其他回答

你可以这样做没有javascript和简单地使用锚标签?然后它将被那些免费的js访问。

虽然你正在使用情态动词,我假设你不关心js自由。;)

如果没有动画,你可以使用纯JS:

scroll(0,0)

用动画,检查尼克的答案。

你可以像这样设置scrollTop:

$('html,body').scrollTop(0);

或者如果你想要一个小动画而不是一个快照到顶部:

$('html, body').animate({ scrollTop: 0 }, 'fast');

你正在使用jQuery UI对话框,你可以只是样式的模式出现与窗口中的位置固定,所以它不会弹出出视图,否定需要滚动。其他

正如一些响应所暗示的那样,我必须使用window.scrollTo(0,0);而不是scrollTo(0,0);

window.scrollTo (0,0);工作与纯javascript在所有浏览器测试(无动画)。(MDN) (w3schools)。

 

来自MDN的例子:

没有选择:

window.scrollTo(0, 0);

使用选项:

window.scrollTo({
  top: 0,
  left: 0,
  behavior: 'smooth'
});

下面是一个简单的例子,使用javascript内联html:

<button onclick="window.scrollTo(0, 0);">Click to scroll to top</button>

滚动流畅:

<button onclick="window.scrollTo({top: 0, left: 0, behavior: 'smooth'});">Smooth scroll</button>

注意: 在Chrome浏览器(例如89版)中,如果不首先启用平滑滚动,默认情况下似乎无法工作 chrome: / /标志/ #平滑滚动

 


window.scroll (0,0);类似于window.scrollTo(0,0);但是选项的兼容性较差。(参考)。