jQueryUI 菜单隐藏

Question

我使用 UL 元素创建了一个菜单，我正在使用 jQueryUI 来显示这个菜单。

<ul style="display:none" id="action_menu" class="menu">
    <li><a href="javascript:alert(213112);">Edit Translation</a></li>
    <li><a href="javascript:void(0);">Edit Comment</a></li>
    <li><a href="javascript:void(0);">Edit Bind</a></li>
    <li><a href="javascript:void(0);">Edit Reuse</a></li>
    <li><a href="javascript:void(0);">Edit Sync Up</a></li>
    <li><a href="javascript:void(0);">Export</a></li>
    <li><a href="javascript:void(0);">Show History</a></li>
    <li><a href="javascript:void(0);">Upload Screenshot</a></li>
</ul>

当一个按钮被点击时，$("#action_menu").menu() 可以显示这个菜单。 我知道如何显示这个菜单，现在我不知道当鼠标点击其他地方而不是点击菜单时如何隐藏这个菜单。我找了很多例子，他们添加了文档点击监听器，并检查事件目标的父节点是否是这个菜单。像这个链接Hide dropdown menu jQuery 有没有人有更好的主意，我想知道为什么 jQueryUI 不为菜单小部件添加事件或选项。谁能帮帮我，谢谢

Answer 1

这是一个通用的解决方案，我不知道你的插件

$(document).click(function (e)
{
    var container = $(".menu");

    if (container.has(e.target).length === 0)
    {
        container.hide();
    }
});