当鼠标不在链接上时，下拉菜单消失

Dropdown menu disappears when the mouse isn't over a link

本文关键字：下拉菜单 消失 链接 鼠标      更新时间：2023-09-26

所以我尝试使用Jquery制作一个下拉菜单，但是当你尝试选择第二个链接时，菜单消失了。此外，我该如何使它，所以只有一个下拉菜单可以出现一次?

我需要如何修改这个来修复它?

$('#nav a').bind('mouseover', openSubMenu);
$('#nav ul ul').bind('mouseout', closeSubMenu);
function openSubMenu(){
    $(this).parent().find('ul').slideDown(300);
};
function closeSubMenu(){
    $(this).closest('ul').slideUp(300);
};

示例如下:https://jsfiddle.net/g36tywLc/

用mouseleave代替:

$('#nav ul ul').bind('mouseleave', closeSubMenu);

这是一个更新的小提琴

从W3schools:

当鼠标指针离开任何子指针时触发mouseout事件元素以及所选元素。
mouseleave事件仅在鼠标指针离开所选元素时触发。

相关文章：