我正在寻找一种有效的方法来遍历一个无序列表,该列表包含多个级别,其中包含class.selected。如果一个组中的所有UL LI都有class.selectd,我需要添加class.select子UL的父LI。
<ul>
<li>one <-- this li adds class .selected if ALL its children have .selected
<ul>
<li class="selected">red</li>
<li class="selected">green</li>
<li class="selected">blue</li>
</ul>
</li>
<li>two
<ul>
<li class="selected">red</li>
<li>green</li>
<li class="selected">blue</li>
</ul>
</li>
<li>three</li>
</ul>
如果任何给定UL中的所有子级都具有class.selected,则将class.select添加到父LI,因此在这种情况下,包含文本"one"的LI将是唯一添加class.selection的父LI。
我需要在页面加载时发生这种情况。我尝试了很多方法,但这一种最接近,但我不太确定它是否是最有效的:
$("ul li").filter(function () {
var lis_total = $(this).siblings().length + 1;
var lis_selected = $(".selected", this).siblings().length + 1;
if(lis_total == lis_selected)
return $(this).parent("li").addClass("selected");
});
我不太确定我做得是否正确。它不起作用。
如果您想要一行,请尝试http://jsfiddle.net/4JNaL/
$('li ul:not(:has(li:not(.selected)))').parent().addClass('selected');
或
var theParent = $('li ul:not(:has(li:not(.selected)))').parent();
返回操作的元素
对于任意深度的树:http://jsfiddle.net/GQbmU/4/
do {
$results = $('li:not(.selected) > ul:not(:has(li:not(.selected)))');
$results.parent().addClass('selected');
} while ( $results.length > 0);
或者,由于这个答案的主题是一句俏皮话:http://jsfiddle.net/GQbmU/6/
while ( $('li:not(.selected) > ul:not(:has(li:not(.selected)))').parent().addClass('selected').length > 0) {} ;
类似的东西?
$("ul li").filter(function () {
var all = $(this).find('> ul > li'); //get all immediate ul and its immediate li's
var selected = $(this).find('> ul > li.selected'); //get all immediate ul and its immediate li's with class selected
return all.length && all.length == selected.length; //return if there are li's and all are selected
}).addClass('selected'); //add class
演示
$(function () {
$("ul").filter(function () {
var lis_total = $(this).children("li").length + 1;
var lis_selected = $(this).children("li.selected").length + 1;
if (lis_total == lis_selected) {
$(this).parent("li").addClass("selected");
}
});
});
http://jsbin.com/ecixez/2/edit
$('li>ul:has(.selected)').each(function(){
if($('.selected', this).length === $('li',this).length) // if 3 == 3 :)
$(this).parent().addClass('selected');
});