【发布时间】：2016-09-03 19:20:12
【问题描述】：
我使用jQuery-menu-aim 作为我的导航菜单。我遇到了一个问题，当菜单不再被鼠标悬停时，展开的子菜单将保持活动状态。这是我的代码，虽然问题在这里并不容易看到：
$(".nav-section").menuAim({
activate: function(row) {
var $row = $(row)
$(row).toggleClass("nav-active");
var navItem = $(row).attr("data-nav-item");
$(".nav-panel[data-nav-panel='" + navItem + "'").toggleClass("nav-panel-active");
},
deactivate: function(row) {
$(".drop-nav").removeClass("first-hover");
$(row).toggleClass("nav-active");
var navItem = $(row).attr("data-nav-item");
$panel = $("[data-nav-panel='" + navItem + "'")
$panel.toggleClass("nav-panel-active");
},
enter: function() { },
exit: function() { },
exitMenu: function() { },
rowSelector: "> li",
submenuDirection: "right"
});
这是一个 Codepen，它将向您展示我在说什么：http://codepen.io/jimmykup/pen/BNgzzG
将鼠标悬停在红色菜单上，然后将鼠标悬停在菜单项上以展开子菜单。在子菜单可见的情况下，将鼠标完全悬停在菜单之外。然后将鼠标悬停在红色菜单上以再次显示菜单。您会注意到在您离开之前处于活动状态的任何子菜单仍然处于活动状态。我希望在用户鼠标离开菜单并消失时重置子菜单。
我已尝试使用以下代码来实现该行为，但它不起作用，相反，我遇到了一个奇怪的错误，即会突出显示多个父行。
$( ".nav-browse-products" ).mouseleave(function() {
$(".nav-active").toggleClass("nav-active");
$(".nav-panel-active").toggleClass("nav-panel-active");
});
我认为它不能与这个额外的代码一起工作的唯一想法是行停用没有触发。如果没有它，它将保持旧行和新行的激活状态。我不确定是否有办法手动触发行停用。我挖掘了插件，但无法破译它的方法。
任何帮助将不胜感激。
【问题讨论】：
标签： jquery