检查用户是否已滚动到底部 [英] Check if a user has scrolled to the bottom

问题描述

我正在制作一个分页系统（有点像Facebook），当用户滚动到底部时，内容会加载。我想最好的方法是找到用户位于页面底部并运行ajax查询以加载更多帖子。

I'm making a pagination system (sort of like Facebook) where the content loads when the user scrolls to the bottom. I imagine the best way to do that is to find when the user is at the bottom of the page and run an ajax query to load more posts.

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

The only problem is I don't know how to check if the user has scrolled to the bottom of the page with jQuery. Any ideas?

我需要找到一种方法来检查用户是否已使用jQuery滚动到页面底部。

推荐答案

使用 <$ 窗口上的c $ c> .scroll（） 事件，如下所示：

Use the .scroll() event on window, like this:

$(window).scroll(function() {
   if($(window).scrollTop() + $(window).height() == $(document).height()) {
       alert("bottom!");
   }
});

你可以在这里测试一下，这会占据窗口的顶部滚动，所以它向下滚动了多少，增加了可见窗口的高度，并检查它是否等于整个内容的高度（文档）。如果你想检查用户是否在底部附近，它看起来像这样：

You can test it here, this takes the top scroll of the window, so how much it's scrolled down, adds the height of the visible window and checks if that equals the height of the overall content (document). If you wanted to instead check if the user is near the bottom, it'd look something like this:

$(window).scroll(function() {
   if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
       alert("near bottom!");
   }
});

您可以在此测试该版本，只需将 100 调整为您想要触发的底部的任何像素。

You can test that version here, just adjust that 100 to whatever pixel from the bottom you want to trigger on.

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