如何使用JavaScript滚动到页面顶部？滚动条立即跳到页面顶部也是可取的，因为我不希望实现平滑滚动。
当前回答
这样做不需要jQuery。一个标准的HTML标记就足够了。。。
<div id="jump_to_me">
blah blah blah
</div>
<a target="#jump_to_me">Click Here To Destroy The World!</a>
其他回答
<script>
$("a[href='#top']").click(function() {
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
});
</script>
html格式
<a href="#top">go top</a>
纯JavaScript解决方案：
function scrollToTop() {
window.scrollTo({
top: 0,
behavior: 'smooth'
});
我在Codepen上编写了一个动画解决方案
此外，您可以尝试使用CSS滚动行为的另一种解决方案：smooth属性。
html {
scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
html {
scroll-behavior: auto;
}
}
激活所有浏览器。祝你好运
var process;
var delay = 50; //milisecond scroll top
var scrollPixel = 20; //pixel U want to change after milisecond
//Fix Undefine pageofset when using IE 8 below;
function getPapeYOfSet() {
var yOfSet = (typeof (window.pageYOffset) === "number") ? window.pageYOffset : document.documentElement.scrollTop;
return yOfSet;
}
function backToTop() {
process = setInterval(function () {
var yOfSet = getPapeYOfSet();
if (yOfSet === 0) {
clearInterval(process);
} else {
window.scrollBy(0, -scrollPixel);
}
}, delay);
}
许多用户建议同时选择html和body标签以实现跨浏览器兼容性，如下所示：
$('html, body').animate({ scrollTop: 0 }, callback);
如果你指望回调只运行一次，这可能会让你绊倒。它实际上会运行两次，因为您选择了两个元素。
如果这对你来说是个问题，你可以这样做：
function scrollToTop(callback) {
if ($('html').scrollTop()) {
$('html').animate({ scrollTop: 0 }, callback);
return;
}
$('body').animate({ scrollTop: 0 }, callback);
}
这在Chrome$（'html'）中有效的原因。scrollTop（）返回0，但在其他浏览器（如Firefox）中无效。
如果滚动条已经位于顶部，您不想等待动画完成，请尝试以下操作：
function scrollToTop(callback) {
if ($('html').scrollTop()) {
$('html').animate({ scrollTop: 0 }, callback);
return;
}
if ($('body').scrollTop()) {
$('body').animate({ scrollTop: 0 }, callback);
return;
}
callback();
}
您可以使用javascript的内置函数scrollTo：
函数滚动（）{window.scrollTo({顶部：0，行为：“平滑”});}<button onclick=“scroll”>滚动</button>
