HTML structure
<div class="box">
<div class="list">
<p class="active">1
2
</div>
<div class="item">
<div class="item-list cur">
1
2
3
4
5
</div>
<div class="item-list">
1
2
3
4
5
</div>
</div>
</div>
javascript
var list_li = $(".list p");
list_li.click(function(){
$(this).addClass("active").siblings().removeClass("active");
var index = list_li.index(this);
$(".item .item-list").eq(index).addClass("cur").siblings().removeClass("cur");
});
currently, clicking on the category name in list will switch like tab. Click on that category name to display the subcategories under the current click category. The effect you want to achieve is that not only can you switch, but also, if the p tag in the item-list is greater than 2, the other subcategories currently displayed will be hidden, and a full subcategory will be inserted at the end (if the other subcategories are less than or equal to 2, the word will not be inserted). When you click all, expand all subcategories under the current display category, and change all to expand. Clicking on this expansion will put it away and show only 2 subcategories. Could you tell me how to implement it with JQUERY? Thank you very much! ~