在jquery中，我需要动态显示前两个值，然后单击后应显示剩余值？
<div class="category_items">
<div class="category_item">
<div class="test">test1_1</div>
<div class="test">test1_2</div>
<div class="test">test1_3</div>
<div class="test">test1_4</div>
<div class="test">test1_5</div>
<div class="test">test1_6</div>
</div>
<button>Show / Hide</button>
<script type="text/javascript" src="//code.jquery.com/jquery-latest.js"></script>
<script>
var elems = $('.category_item', '.category_items').filter(function() {
return $(this).children().length > 2;
}).hide();
$('button').on('click', function() {
elems.toggle();
});
</script>
我想在单击按钮时默认显示前两个项目 我想显示完整列表
使用 css 执行此操作
.HTML
<style>
li div{display:none;}
li:hover div {display:block;position:absolute;left:200px;width:100px;height:100px;background-color:red;}
</style>
<ul>
<li>123<div>1</div></li>
<li>222<div>2</div></li>
<li>333<div>3</div></li>
</ul>
enter code here
：gt 选择器将适用于这种情况。我希望，这段代码对您有所帮助。
<script>
$('.category_item .test:gt(1)').hide();
$('button').on('click', function() {
$('.category_item .test:gt(1)').toggle();
});
</script>
如果要更改要显示的元素数，只需在 gt（） 选择器中更改数字即可。
也看到这个，但我不确定使用 span 作为 ul 而不是 li 的孩子是否正常，但你可以把最后一个 li 另一个 ul 放进去，当显示这个新的 ul 时。当邹悬停时，这一切都显示 ul bu zou 可以做以显示所有 li onli 时，有些人认为一个作为示例 + 悬停最后显示 li（用户无需单击即可查看 al！
<style>
ul span{display:none;}
ul:hover span {display:block;/*position:absolute;left:200px;background-color:red;*/}
</style>
<ul>
<li>123<div>1</div></li>
<li>22<div>2</div></li>
<span>
<li>223<div>3</div></li>
<li>223<div>3</div></li>
<li>223<div>3</div></li>
</span>
</ul>