Question

我在鼠标离开祖父母div时立即触发fadeOut的下拉菜单遇到了一些麻烦，我已经将此问题搜索到了死亡状态并且尚未找到优雅的解决方这是我的代码：link

var main = function() {  
    $('nav').mouseenter(function() {
        $('ul li ul').fadeIn('400');
    });

    $('nav ul li').mouseleave(function(){
        $('ul li ul').fadeOut('400');
    });
}

$(document).ready(main);

Answer 1

DEMO：MY FIDDLE

您需要指定尝试将事件附加到的元素。添加“＆gt;”你强迫只将事件附加到该元素的子元素。试试这个：

    var main = function() {
        $('nav').mouseenter(function() {
            $(this).find('ul').fadeIn('400');
        });

        $('nav>ul>li').mouseleave(function() {
            $(this).find('ul').fadeOut('400');
        });
    };

Answer 2

FIDDLE

$(this).find('ul').fadeOut('400');

是正确的$('ul>li>ul').fadeOut('400');无法定位特定的（current）li。

使用以下TAGS分层流程

var main = function() {
        $('nav').mouseenter(function() {
            $('ul li ul').fadeIn('400');
        });

        $('nav ul li').mouseleave(function() {
            $(this).find('ul').fadeOut('400');
        });
    };

离开祖父母div时，Mouseleave触发

2 个答案: