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

时间:2015-06-18 02:23:45

标签: jquery range infinite-scroll

在我的页面上,我有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');

可能是一种更有效的方法来解决这个问题。

感谢

1 个答案:

答案 0 :(得分: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/