自动滚动到页面底部

javascript jquery scroll scrollto js-scrollintoview

2022-08-29 22:41:37

我有一个问题清单。当我点击第一个问题时，它应该会自动将我带到页面底部的特定元素。

我如何使用jQuery执行此操作？

答案 1

jQuery 不是必需的。我从Google搜索中获得的大多数顶级结果都给了我这个答案：

window.scrollTo(0, document.body.scrollHeight);

在具有嵌套元素的位置，文档可能不会滚动。在这种情况下，您需要定位滚动的元素并改用其滚动高度。

window.scrollTo(0, document.querySelector(".scrollingContainer").scrollHeight);

您可以将其与问题的事件联系起来（即）。onclick<div onclick="ScrollToBottom()" ...

您可以查看的一些其他来源：

答案 2

要将整个页面滚动到底部：

const scrollingElement = (document.scrollingElement || document.body);
scrollingElement.scrollTop = scrollingElement.scrollHeight;

您可以在此处观看演示

将特定元素滚动到底部：

const scrollToBottom = (id) => {
    const element = document.getElementById(id);
    element.scrollTop = element.scrollHeight;
}

以下是它的工作原理：

更新：最新版本的 Chrome （61+）和 Firefox 不支持身体滚动，请参阅：https://dev.opera.com/articles/fixing-the-scrolltop-bug/