javascript - JQuery悬停下拉菜单在悬停在下拉菜单上时消失

Question

我正在做的事情与我所看到的工作略有不同，很多人都做过，所以下拉列表是子列表的一部分。不过，我正在尝试使用同级下拉菜单。

这是我的 fiddle :http://jsfiddle.net/58m99wf8/

您会注意到，如果您将鼠标悬停在该按钮上，则会出现下拉菜单。如果你离开按钮它就会消失，这是完美的。但是，如果您将鼠标悬停在下拉菜单上，它仍然会消失，这不是我想要的。

如何防止这种情况发生？

我见过它是这样工作的:

if($('#menuONE').has(e.target).length === 0) {
        // toggle menu to close
    }

但是我不知道如何将其附加到子菜单和按钮。

Answer 1

您可以做的是将菜单添加到选择器。 我还定义了菜单，因为它现在可以引用按钮或菜单，因此从那里遍历可能会出现问题。

var menu = $('.dropdown-menu');

$('.dropdown-hover-toggle, .dropdown-menu').hover(

function () {
    //show its sibling menu
    menu.stop().slideDown();
},

function () {
    //hide its sibling menu
    menu.stop().slideUp();
});

http://jsfiddle.net/58m99wf8/1/