jQuery Dropdown在从div悬停到div时保持关闭

Question

我从两个不同的div中进行了下拉。一个是触发器，一个是子菜单。如果鼠标从触发器悬停到子菜单，则子菜单将关闭。即使鼠标在两个div之间切换，我如何保持它打开？

此外，我无法移动下拉触发器中的子菜单容器。它们需要是两个独立的div。

$('.dropdown-trigger,.submenu-container').hover(
function(){$('.submenu-container').css('display', 'block')},
function(){$('.submenu-container').css('display', 'none')},
);

提前感谢您！

Answer 1

您可能不需要jquery。你可以用css来做。类似于你在jquery 中可以做的事情

.dropdown {
max-width: 200px;
list-style: none;
padding: 10px;
position: relative;
}
.item {
display: none;
padding: 10px 20px;
border: 1px solid #000;
}
.item.default {
display: flex;
justify-content: space-between;
}
.dropdown:hover .item {
display: block;
}
.dropdown:hover .item.default {
display: flex;
}

<ul class="dropdown">
<li class="item default">Select <span>V</span></li>
<li class="item">1</li>
<li class="item">1</li>
<li class="item">1</li>
<li class="item">1</li>
</ul>