使用此HTML作为示例来说明当单击第二组中的第二个.multi元素时我想要实现的内容:
<div id="someID1">
<div id="someID2">
<div class="multi">hello world</div>
<div>
<div class="multi">hello world</div>
</div>
<div>
<div>
<div class="multi">hello world</div>
</div>
</div>
</div>
<div id="someID3">
<div class="multi">hello world</div>
<div>
<div class="multi">I am the one clicked in this example</div>
</div>
<div>
<div>
<div class="multi">hello world</div>
</div>
</div>
</div>
</div>
创建一个jQuery选择器,它可以taget#someID3中包含的三个.multi实例。 我无法控制#someID3的类或ID。 #someID3里面的内容结构可以是任何东西。所有已知的是它将包含至少一个.multi元素的实例。我们知道这是因为它被点击了。 但我们希望在click事件中定位#someID3内的.multi的所有实例。 为了说明,我们只想改变它们的背景颜色。
$(".multi").click(function(){
// find the common parent ID, in this case #someID3..?
var theCommonParentID = ??
// so we can then do..
$(theCommonParentID + " .multi").css("background","#ff0000");
})
我不相信这是有效的jQuery,但它是我认为我需要做的事情:
$(".multi").click(function(){
var theCommonParentID;
$(this).parents().each(function({
if ($(".mutli", this).length > 0){
theCommonParentID = $(this).attr("id");
}else{
$(theCommonParentID + " .multi").css("background","#ff0000");
return
}
}));
})
答案 0 :(得分:2)
你可以使用它是第一个具有id属性的祖先这样的事实
$(".multi").click(function(){
$(this).closest('div[id]').find('.multi').css("background","#ff0000");
})