在窗口滚动时检测到容器底部

Question

我有一个 HTML 页面，中间有一个产品容器。当用户使用窗口滚动到达产品容器的末尾时，我想调用 ajax 调用以加载更多产品。如何检测用户是否已滚动并到达产品容器的末尾？ 注意：产品容器不可滚动，也不是页面的结尾。我在它后面有一个页脚。

Answer 1

有很多方法可以做到这一点。最简单的方法之一是获取容器底部与视口/可见屏幕顶部的距离，并检查它是否小于屏幕高度。 您可以使用 element.getBoundingClientRect() 获取容器所有边的所有距离。

基本上它返回这些值，如下图所示-

您可以在此处阅读更多相关信息 - https://www.digitalocean.com/community/tutorials/js-getboundingclientrect

现在你的代码应该看起来像 -

var rect=document.getElementById("container").getBoundingClientRect();
var bottom=rect.bottom;
if(bottom <= window.innerHeight){
   //reached the end. Load more stuff
}

Answer 2

if(obj.scrollTop === (obj.scrollHeight - obj.offsetHeight)) {}

我觉得？