使用没有分页标记的jQuery无限滚动插件？答案

【问题标题】：Using jQuery Infinite scroll plugin without pagination markup?使用没有分页标记的jQuery无限滚动插件？
【发布时间】：2013-02-21 02:20:51
【问题描述】：

所以我正在尝试实现流行的无限滚动插件来替换我当前自制的无限滚动脚本：

http://www.infinite-scroll.com/ & https://github.com/paulirish/infinite-scroll

无论如何，这个插件似乎需要在页面上有 html 分页。即由于这些选项：

nextSelector: "div.navigation a:first",
navSelector: "div.navigation",

我的页面上没有分页标记。我不在乎我的网站是否与爬虫/js 禁用用户不兼容。

那么有没有办法实现这个插件而不需要物理的html分页呢？

在我的自定义脚本中，我正在执行以下操作：

var $page = 1;

// Load content for $page

$page++;

任何类似的东西，即我可以将起始页作为整数传递？

【问题讨论】：

标签： javascript jquery infinite-scroll

【解决方案1】：

看看这个非常简化的无限滚动版本，它不需要任何分页元素。

http://www.innovativephp.com/demo/infinitescroll/

【讨论】：

【解决方案2】：

您可以使用 jQuery/javascript 轻松创建它。

现在写一个通用的东西有点难，但主要的原则是这样的：

如果您正在加载最新的内容（最新的在前，旧的滚动）：

加载比屏幕高度略高的第一组元素（无论是博文、图片、引号）。将最后一项的 ID 保存在变量中。
使用 setInterval 检测用户是否滚动页面，然后加载 ID 低于您保存的最后一个 ID 的数据。然后继续保存最后一个 ID 并加载新内容。

祝你好运！

类似这样的：

function loadnewdata()
{
    // do ajax stuff, update data.
}
setInterval(
  function (){
    if(($(document).height() - $(window).height() - $(document).scrollTop()) < 500){
    loadnewdata();
    }
  }, 
  500
);

当然，您会为自己编写 loadNewData() 函数。取决于你的数据。如果用户滚动了页面，这将每 500 个加载新数据。

【讨论】：

我知道我可以自己做，我已经做到了。但我想用那个插件替换它，因为它有很多其他功能以及 jquery masonry 集成，否则会很棘手。
那我不确定我能不能帮上忙，以前甚至无法让那个脚本工作。