检查用户是否已滚动到底部(不仅是窗口，还有任何元素) [英] Check if a user has scrolled to the bottom (not just the window, but any element)

问题描述

我正在制作一个分页系统(有点像Facebook)，当用户滚动到底部时加载内容。我想最好的方法是找出用户何时在页面底部，然后运行Ajax查询来加载更多帖子。

唯一的问题是我不知道如何检查用户是否已滚动到页面底部。有什么想法吗？

我正在使用jQuery，因此请随时提供使用它的答案。

推荐答案

我不太确定为什么还没有发布，但根据the documentation from MDN，最简单的方法是使用原生javascript属性：

element.scrollHeight - element.scrollTop === element.clientHeight

当您位于任何可滚动元素的底部时，

返回TRUE。所以只需使用javascript：

element.addEventListener('scroll', function(event)
{
    var element = event.target;
    if (element.scrollHeight - element.scrollTop === element.clientHeight)
    {
        console.log('scrolled');
    }
});

scrollHeight在浏览器中有广泛的支持，更准确地说是从ie8开始，而clientHeight和scrollTop都是大家都支持的。即使是ie 6。这应该是跨浏览器安全的。

这篇关于检查用户是否已滚动到底部(不仅是窗口，还有任何元素)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！