jQuery无休止滚动的替代品
有没有jQuery无限滚动插件的替代品？
http://www.beyondcoding.com/2009/01/15/release-jquery-plugin-endless-scroll/
例如无限滚动插件
这应该在没有插件的情况下做同样的技巧
$(window).scroll(function () { if ($(window).scrollTop() >= $(document).height() - $(window).height() - 100) { //Add something at the end of the page } }); 编辑2014年1月15日
根据@ pere的评论， 最好使用下面的代码来避免过多的事件触发 。
灵感来自这个答案https://stackoverflow.com/a/13298018/153723
var scrollListener = function () { $(window).one("scroll", function () { //unbinds itself every time it fires if ($(window).scrollTop() >= $(document).height() - $(window).height() - 100) { //Add something at the end of the page } setTimeout(scrollListener, 200); //rebinds itself after 200ms }); }; $(document).ready(function () { scrollListener(); });
结合Ergec的回答和Pere的评论：
function watchScrollPosition(callback, distance, interval) { var $window = $(window), $document = $(document); var checkScrollPosition = function() { var top = $document.height() - $window.height() - distance; if ($window.scrollTop() >= top) { callback(); } }; setInterval(checkScrollPosition, interval); }
distance是回调将触发时屏幕底部的像素数。
interval是检查运行的频率（以毫秒为单位; 250-1000是合理的）。
我认为最好自己在jQuery中编写代码而不是使用插件，因为大多数情况下你需要自定义function。
几个月前，我用jQuery Mobile，JSON，PHP和MySQL编写了一个例子 ，看看运行的演示 。 正如您所看到的，JavaScript中的行数并不多，而且它还可以预取以立即显示结果。
我找不到一个完全符合我想要的东西，所以我从头开始构建了一个。 它具有暂停function，因此在滚动时不会无限加载。 有时候有人可能想看页面页脚。 它只需附加“显示更多”按钮即可继续追加。 我还整合了localStorage，因此当用户点击它时，它们不会在结果中失去位置。
http://www.hawkee.com/snippet/9445/
它还有一个回调函数，可以调用它来操作新附加的结果。
这里有一个关于如何在没有插件的情况下进行操作的小指南。 http://dumpk.com/2013/06/02/how-to-create-infinite-scroll-with-ajax-on-jquery/
这应该处理在事件触发之前用户到达页面底部的错误。 我在项目中看到了这一点，如果您已经在页面底部，则应在初始化事件之前进行检查。
var scrollListener = function () { executeScrollIfinBounds(); $(window).one("scroll", function () { //unbinds itself every time it fires executeScrollIfinBounds(); setTimeout(scrollListener, 200); //rebinds itself after 200ms }); }; $(document).ready(function () { scrollListener(); }); function executeScrollIfinBounds() { if ($(window).scrollTop() >= $(document).height() - $(window).height() - 100) { //Add something at the end of the page } }