有没有一种方法可以通过 jquery 向所有包含 ul 且只有一个列表元素(如 div.filter_7)的 div 添加一个类。使用 jQuery,我需要遍历每个 div.list-container 并计算列表元素。如果列表元素小于 2,则 jquery 应该附加一个类。
<div class="filter_group">
<div class="filter-holder filter_1">
<h4>Test</h4>
<div class="list-container">
<ul class="list filter">
<li class="list_id1">list_id1</li>
<li class="list_id2">list_id2</li>
<li class="list_id3">list_id3</li>
<li class="list_id4">list_id4</li>
<li class="list_id5">list_id5</li>
</ul>
</div>
</div>
<div class="filter-holder filter_2">
<h4>Test</h4>
<div class="list-container">
<ul class="list filter">
<li class="list_id11">list_id11</li>
<li class="list_id22">list_id22</li>
<li class="list_id33">list_id33</li>
<li class="list_id44">list_id44</li>
<li class="list_id55">list_id55</li>
</ul>
</div>
</div>
<div class="filter-holder filter_6">
<h4>Test</h4>
<div class="list-container">
<ul class="list filter">
<li class="list_id111">list_id111</li>
<li class="list_id222">list_id222</li>
<li class="list_id555">list_id555</li>
</ul>
</div>
</div>
<div class="filter-holder filter_7">
<h4>Test</h4>
<div class="list-container">
<ul class="list filter">
<li class="list_id1111">list_id1111</li>
<li class="list_id2221">list_id2222</li>
</ul>
</div>
</div>
这是我到目前为止用 jquery 所做的,但它似乎是错误的:
var total = 0;
$(document).ready(function() {
$('.list-container').each(function(idx, item){
total = $(".list-container>ul").size();
if (6 >= total) {
$('.list-container').parent('div').addClass('noshow');
} else {
alert(total);
}
});
});
最佳答案
您不需要过滤或每个...
您可以使用 jQuery.has()结合 :only-child
。从this jsFiddle可以看出演示和代码如下。
jQuery("div.list-container").has("li:only-child").addClass("noshow");
与使用过滤器相比,阅读起来方式更清晰。您可以稍微修改 has 以使其更具体。
关于jQuery 如何将类添加到特定的 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9807723/