通過DOM和顯示隱藏元件循環

Question

我有一組被分成的5各自鏈段圍繞一個id和類一個div包裹記錄。

例如

<div id="myid" class="myclass"> 
<p>record1</p> 
<p>record2</p>  
</div> 

顯示第一組5條記錄，其餘都被隱藏。 我有一個鏈接下面有點擊更多。一旦點擊它就會出現另一個5，等等等等

每個容器都有用OFF和ON的類。這告訴我什麼div顯示和什麼div沒有。

現在我要顯示的每個組記錄的點擊每個indivudual點擊。 我已經完成了這段代碼，但似乎沒有工作。我在jquery中的知識是有限的。

$(document).ready(function() { 

// get first reviewBulkContainer and show 
$(".reviewBulkContainer:first").show().addClass("On"); 

$("#showMoreReviews").click(function (e) { 
    e.preventDefault(); 
    $("#reviewContainer .reviewBulkContainer").each(function() { 
     if ($(this).hasClass("Off")) { 
      $(this).show(); 
      $(this).removeClass("Off"); 
      $(this).addClass("On"); 
      return; 
     } 

    }); 
}); 

但是，這最終顯示了所有的記錄段，而不僅僅是一個時間段。 任何人都可以幫助我嗎？

謝謝...

Answer 1

沒有必要使用each方法，你可以使用:first選擇，如果你想顯示帶班的Off的第一要素。

$("#showMoreReviews").click(function (e) { 
    e.preventDefault(); 
    $("#reviewContainer .reviewBulkContainer.Off:first") 
              .show() 
              .toggleClass("Off On"); 
});