如何使用jQuery获取特定类的ID？

Question

我有一些div元素的类名为hover，这些div元素的父div元素的类名为hoverparent，但是这些父元素的id是不同的。

是否可以在将鼠标悬停在我的.hover div元素上时获得相应.hoverparent元素的ID？

我试着通过以下方式得到这个：

$('.hoverparent').attr('id')

但它每次都会给出相同的第一个父id。

结构类似于：

<div class="hoverparent" id="hover-1">
<div class="hover">ABC</div>
</div>
<div class="hoverparent" id="hover-2">
<div class="hover">DEF</div>
</div>

Answer 1

您需要使用parent或closest函数遍历DOM树以找到您正在查找的“父”元素：

$(".hover").hover(function() {
    var $parent = $(this).closest(".hoverparent");
    alert($parent.attr("id"));
});

parent和closest之间的区别在于，只有当.hoverparent元素是.hover元素的直接父元素时，第一个元素才有效；closest将向上搜索所有祖先以找到它。

Answer 2

在悬停回调中尝试$(this).parent().attr('id')。

Answer 3

$('.hover').mouseover(function() {
    $(this).parent().attr('id');
});