98

举一个简化的例子，我在页面上重复了以下块很多次（它是动态生成的）：

<div class="box">
   <div class="something1"></div>
   <div class="something2">
      <a class="mylink">My link</a>
   </div>
</div>

单击后，我可以通过以下方式访问链接的父级：

$(".mylink").click(function() {
   $(this).parents(".box").fadeOut("fast");
});

但是...我需要找到<div class="something1">那个特定的父母。

基本上，有人可以告诉我如何在不能直接引用的情况下引用更高级别的兄弟姐妹吗？姑且称其为大哥吧。直接引用老大哥的类名会导致页面上该元素的每个实例都淡出——这不是预期的效果。

我试过了：

parents(".box .something1") ... no luck.
parents(".box > .something1") ... no luck.
siblings() ... no luck.

任何人？谢谢。

4

5 回答 5

154

调用.parents(".box .something1")将返回与选择器匹配的所有父元素.box .something。换句话说，它将返回位于.something1和内部的父元素.box。

您需要获取最近父母的孩子，如下所示：

$(this).closest('.box').children('.something1')

此代码调用.closest以获取与选择器匹配的最内层父元素，然后调用.children该父元素以查找您要查找的叔叔。

于 2010-03-08T02:27:24.297 回答
20 
$(this).parent()

树遍历很有趣

$(this).parent().siblings(".something1");

$(this).parent().prev(); // if you always want the parent's previous sibling

$(this).parents(".box").children(".something1");

还有更多方法，您可能会发现这些文档很有帮助。

于 2010-03-08T02:27:11.257 回答
15

这将找到第一个具有类的父类，box然后找到具有正则表达式匹配的第一个子类something并获取 id。

$(".mylink").closest(".box").find('[class*="something"]').first().attr("id")
于 2013-08-06T03:04:29.617 回答
7

如果我正确理解了您的问题，$(this).parents('.box').children('.something1')这就是您要找的吗？

于 2010-03-08T02:33:50.623 回答
5

您可以在括号内使用.each()with和选择器：.children()

//Grab Each Instance of Box.
$(".box").each(function(i){

    //For Each Instance, grab a child called .something1. Fade It Out.
    $(this).children(".something1").fadeOut();
});
于 2013-03-25T22:10:10.630 回答