這個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(); 
    }