jQuery-hover被触发，即使它不应该'；不可能

我有一个简单的jQuery下拉列表，如下所示：

我想实现的是，如果“更多”按钮悬停，下拉菜单将向下滑动，如果光标离开“更多”或下拉菜单，它将滑动

但是，如果我添加了另一个事件，这样当单击任何下拉菜单时，整个下拉菜单都会滑动，它就不起作用了。出于某种原因，它还会触发“悬停”效果，使下拉菜单保持闪烁

html:

---

实际上，您可以使用纯css解决方案：

小提琴：

HTML

编辑：

下拉列表容器是可选的，但我喜欢将内容包装起来进行分组

编辑2：忘记解释了。。。
主要部分是：

.dropdown-container .dropdown {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s;
}

.dropdown-container .dropdown:hover,
.dropdown-container .handle:hover + .dropdown {
    max-height: 200px;
}

在这里，
.dropdown
默认设置为
最大高度：0
，因此它不会显示在屏幕上

然后，如果将鼠标悬停在
.handle
上，则规则
.handle:hover+.dropdown
将匹配并设置
最大高度：200px
，只要该高度大于实际高度，就可以将其更改为所需的任何高度（对于外观更好的动画，首选精确值）。如果更改为将鼠标悬停在
.dropdown
上，则规则
.dropdown容器。dropdown:hover
将生效

瞧。
也许这就是你想要的：

请在您的问题中包含具有代表性的HTML和jQuery/JavaScript。不要假装你的链接是代码来规避报告的错误。所有的代码都在jsfiddle.net中。我想看到它会更容易，然后把代码放进去here@Josh这确实使它变得更容易，但仍然需要在您的问题中，以防JSFIDLE不可用。（这种情况偶尔会发生）。好的，下次我会在这里包含代码。注意，“hover”伪事件在jQuery的最新版本中已被删除。它在1.8中被弃用，在1.9中被删除。我不想要任何解决方案，我想找出它不起作用的原因。它不起作用，因为当它向上滑动时，会触发一个mouseout事件，然后它会扩展并触发mouseover事件……等等。我真的不想知道我把console.log同时放在了鼠标悬停和点击上。当单击调用slideup时，它不会触发hover console.log
$(function() {
    $('#table').on('hover', '.container', function(event) {
        console.log('hover');
        $(this).find('div').slideToggle(100);
            event.preventDefault();
    });

    $('#table').on('click', '.container li', function(event) {
         $(this).parents(".list").slideUp('slow').show();

    });
})();

<div class="dropdown-container">
   <a href="#" class="handle">More</a>
   <div class="dropdown">
       <ul>
           <li>1</li>
           <li>2</li>
           <li>3</li>
       </ul>
   </div>
</div>

.dropdown-container {
    width: 150px;
}

.dropdown-container .dropdown {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s;
}

.dropdown-container .dropdown:hover,
.dropdown-container .handle:hover + .dropdown {
    max-height: 200px;
}

.dropdown-container .dropdown ul {
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 5px;
}

.dropdown-container .dropdown ul li {
    padding: 5px 10px;
    color: #0061a7;
}

.dropdown-container .dropdown ul li:hover {
    background-color: #0061a7;
    color: #ffffff;
}

.dropdown-container .dropdown {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s;
}

.dropdown-container .dropdown:hover,
.dropdown-container .handle:hover + .dropdown {
    max-height: 200px;
}

$(function() {
    $('#table').on('mouseover', '.manage', function() {
        $(this).siblings('div').slideDown('slow');
    }).on('mouseleave', '.container', function(event) {
        $(this).find('div').slideUp('slow');
    });

    $('#table').on('click', '.container li', function() {
        $(this).parents(".list").slideUp('slow').show();
    });
});