我有一个问题清单。当我点击第一个问题时，它应该会自动将我带到页面底部的特定元素。
我怎样才能用 jQuery 做到这一点？
自动滚动到页面底部
IT技术
javascript
jquery
scroll
scrollto
js-scrollintoview
2021-01-09 20:07:46
6个回答
jQuery 不是必需的。我从 Google 搜索中获得的大多数最佳结果都给了我这个答案：
window.scrollTo(0,document.body.scrollHeight);
如果您有嵌套元素，文档可能不会滚动。在这种情况下，您需要定位滚动的元素并使用它的滚动高度。
window.scrollTo(0,document.querySelector(".scrollingContainer").scrollHeight);
您可以将其与问题的onclick事件联系起来（即<div onclick="ScrollToBottom()" ...）。
您可以查看一些其他来源：
要将整个页面滚动到底部：
var scrollingElement = (document.scrollingElement || document.body);
scrollingElement.scrollTop = scrollingElement.scrollHeight;
见例子上的jsfiddle
要将元素滚动到底部：
function gotoBottom(id){
var element = document.getElementById(id);
element.scrollTop = element.scrollHeight - element.clientHeight;
}
这是它的工作原理：
参考：scrollTop，scrollHeight，clientHeight
更新：最新版本的 Chrome (61+) 和 Firefox 不支持滚动正文，请参阅：https : //dev.opera.com/articles/fixing-the-scrolltop-bug/
Vanilla JS 实现：
element.scrollIntoView(false);
https://developer.mozilla.org/en-US/docs/Web/API/element.scrollIntoView
您可以使用它以动画格式向下浏览页面。
$('html,body').animate({scrollTop: document.body.scrollHeight},"fast");
下面应该是跨浏览器的解决方案。已在 Chrome、Firefox、Safari 和 IE11 上进行测试
window.scrollTo(0, document.body.scrollHeight || document.documentElement.scrollHeight);
window.scrollTo(0,document.body.scrollHeight); 不适用于 Firefox，至少适用于 Firefox 37.0.2