无限滚动：显示范围之间的元素

Question

在我的页面上，我有 16 个元素。最初只有 4 个显示，其余 5-16 个隐藏在页面上。在页面加载时，我使用 :gt 选择器隐藏设置为 4 的“每页帖子”编号之外的所有内容。

this.ppp    = 4;
this.count  = this.ppp - 1;
$('li.item:gt(' + this.count + ')').addClass('hide');

当我发起一个无限滚动事件时，通过滚动到页面底部，我怎样才能找到范围 5-8 之间的所有元素，然后在下一个事件中找到 9-12 之间的元素，依此类推在我的帖子每页价值上。

我尝试使用 .nextUntil() 和 :eq 但使用 :eq 方法会返回一个对象，而 nextUntil() 需要一个类似 'li.item' 的字符串。

this.count += this.ppp;
var eq = $("ul.items li.item").eq(this.count);
$('ul.items).nextUntil(' + eq  + ')').addClass('show');

可能是一种更好更有效的方法来解决这个问题，只是寻找一些想法。

谢谢

Answer 1

要显示隐藏items，最好使用这个：

$('li.item.hide:lt(' + this.ppp + ')').removeClass('hide');

取而代之的是：

this.count += this.ppp;
var eq = $("ul.items li.item").eq(this.count);
$('ul.items).nextUntil(' + eq  + ')').addClass('show');

检查这个最小的例子：https://jsfiddle.net/lmgonzalves/q9oh7eb9/