2

我试图让一个 div 显示链接何时悬停。

也会有多个类，所以只有最近的应该显示。

这就是我正在尝试的：

$(".box").hover(function() {
    $('.overlay').closest.show();
});

<div class="event" id="selector">                                       
    <a class="box" href="#" title="">Event</a>      
    <div class="overlayOuter">    
        <div class="overlayInner"></div>    
    </div>    
    <div class="overlay" style="display:none;"> I will come out when class Box is covered 
    </div>    
</div>

当我悬停时class="box"，class="overlay"会显示。

问题是 Overlay 没有出现所以我猜我的 jquery 是错误的？

我怎样才能让它工作？

4

4 回答 4

7

试试这个，overlay 不是父级，它是兄弟级，closest() 获取最近的父级

   $(this).siblings('.overlay').show();
于 2013-09-27T09:10:05.660 回答
3

你需要使用 .siblings() 因为overlay它不是祖先元素，它是兄弟元素

$(".box").hover(function() {
    $(this).siblings('.overlay').show()
})
于 2013-09-27T09:10:15.510 回答
3

尝试这个：

$(this).siblings('.overlay').show();
于 2013-09-27T09:10:02.590 回答
2

在当前情况下overlay是兄弟姐妹，closest获取最近的父母。

最近的

对于集合中的每个元素，通过测试元素本身并向上遍历其在 DOM 树中的祖先来获取与选择器匹配的第一个元素。

兄弟姐妹

获取匹配元素集中每个元素的兄弟姐妹，可选地由选择器过滤。

代码：

$(".box").hover(function() {
    $(this).siblings('.overlay').show();
});

演示：http: //jsfiddle.net/IrvinDominin/tJr2e/

于 2013-09-27T09:11:03.407 回答