这个jquery代码中的小逻辑问题：用jquery“加载”更多页面

Question

我在新闻索引页面有很多article div，其中每个div包含一个新闻预告。

我想先显示10个，然后在滚动到底部时，我会显示另一个10等等。这是我的js。

$(function() { 
    shown = 0; 
    $('.artikel').hide(); 
    $('.artikel').each(function() { 
    if (shown <= 10) { 
     shown += 1; 
     $(this).show(); 
    } 
    }); 
    $(window).scroll(function() { 
    if ($(window).scrollTop() + $(window).height() == $(document).height()) { 

     setTimeout(function() { 
      // problem here. 
      $('.artikel').each(function() { 
       if (shown <= 20) { 
        shown += 1; 
        $(this).show(); 
       } 
      }); 


     }, 1500); 
    } 
    }); 
}); 

在我的逻辑问题是，一旦我滚动到底部，里面的setTimeout功能齐全article又在发从开始计数。

我希望它显示从最后显示的文章开始的下一个10条新闻。有人可以给这个小小的帮助吗？

Answer 1

您可以找到第一隐藏物品，然后显示10篇以下文章，所以你不必保持多少你到目前为止显示计数：

var shownCount = 0; 

$('.artikel:not(:visible)').each(function() { 
    if (shownCount <= 10) { 
     shownCount += 1; 
     $(this).show(); 
    }