使用 jQuery 伪造更多负载（无 AJAX/PHP）

Question

我有一个页面上的数据列表，一个大约 100 个项目的简单有序列表，只是一个标题和摘录，就像存档页面上的一样。

在页面加载时，我想隐藏除前 25 个项目之外的所有项目，并可以选择再加载 25 个、25 个，直到它们全部可见。

我已经研究过像 jPaginate 这样的简单分页插件，但只是希望列表每次都扩展 25。

只是好奇你的想法 - 谢谢！

Answer 1

在所有项目之间共享一个公共类，并使用 jQuery 每次显示更多元素。

<div class="listitem">list item 1</div>
<div class="listitem">list item 2</div>
<div class="listitem">list item 3</div>
<div class="listitem">list item 4</div>
<div class="listitem">list item 5</div>
<div class="listitem">list item 6</div>
<div class="listitem">list item 7</div>
<div class="listitem">list item 8</div>
<div class="listitem">list item 9</div>
<div class="more">showmore</div>

** jQuery **

$(".listitem").hide();
$(".listitem").slice(0, 2).show();

$(".more").click(function(){
    var showing = $(".listitem:visible").length;
    $(".listitem").slice(showing - 1, showing + 2).show();
});

供您参考：http : //api.jquery.com/slice/

编辑： 这是一个 jsFiddle，展示了这一点...... http://jsfiddle.net/uQWGB/1/