Question

我有一组记录被分成5个部分，每个部分包含一个带有id和class的div。

e.g。

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

显示第一组5条记录，其余的则隐藏。我有一个链接下面有点击更多。点击后，它将显示另外5等等。

每个容器都有一个Off和On的类。这告诉我div显示的是什么，div是什么。

现在我想在每次单击点击时显示每组记录。我已经完成了这段代码，但似乎没有用。我对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");
});

循环遍历DOM并显示隐藏元素

1 个答案: