jQuery的选择只有孩子,直到特定类
问题描述:
我在下面的树结构的一些递归的HTML:jQuery的选择只有孩子,直到特定类
div.item div.content input div.container div.item div.content input div.container div.item etc...
这里有一个工作示例的jsfiddle:http://jsfiddle.net/HWHRZ/
我也有jQuery的引用一个对象每个.item
divs。
我想要做的是,对于任何特定的.item
,只选择立即在下面的输入,不包括任何更深的.container
或.item
元素中的输入。
为了使事情更加复杂,并不是每个.item
在输入方面都具有相同的布局。有时输入可能在其他div
元素中,因此用简单的.find('> .content :input')
选择它们并不总是有效。
我发现了一个解决方案,但它对大树效率不高,并且根本不优雅: $(':input', $item).not($('.container :input', $item)).toggleClass('changed');
($item
是我保留在对象中的引用)。这个解决方案的工作原理应该如此,但对于任何足够大的树结构而言效率太低,not()
将不得不处理大量的节点。
简而言之:我需要选择不在特定其他子节点内的特定子节点。
有没有人知道这样做的更有效的方法?
答
我觉得
$.each($($(".item")[0]).children(".changed"),function(){
$(this).removeClass("changed")
})
应该工作。
答
此功能可以帮助:
$.fn.childrenUntil = function(selector, result)
{
result = typeof result !== 'undefined' ? result : new $();
this.children().each(function(){
var thisObject = $(this);
if(thisObject.is(selector))
result.push(this);
else
thisObject.childrenUntil(selector, result);
});
return result;
}
它遍历树,直到它遇到的选择。
所以,你有没有封闭的'div'标签,大多数(如果不是全部的话)'输入'标签没有自闭合斜线,没有关闭的'select'元素,多个具有相同'id'的元素...... – 2012-04-17 13:35:44
你可以发布你的HTML jsfiddle,真的有帮助 – Jayanga 2012-04-17 14:31:09
@DavidThomas。是。你几乎认为它只是为了显示树结构而不是实际的HTML。我会设置一个jsfiddle来帮助你更好地理解。 – Martijn 2012-04-17 18:14:43