如何关闭 jQuery 上下文菜单

【问题标题】：How to close the jQuery context menu如何关闭 jQuery 上下文菜单
【发布时间】：2014-05-23 12:22:57
【问题描述】：

我在 jQuery 中显示一个上下文菜单，但无法关闭它。

这些是我正在注册的活动：

function openContextMenu(event) {
    event.preventDefault();
    $("#custom-menu")
        .css({
        top: event.pageY + "px",
        left: event.pageX + "px"
    })
        .show(100);
    isContextMenuOpen = true;
}

function closeContextMenu(event) {
    console.log("Click called on document");
    if (isContextMenuOpen) {
        $("custom-menu").hide();
        console.log("Hide the context menu");
    }

    isContextMenuOpen = false;
}

function registerMenu() {

    $(document).on({
        contextmenu: function (event) {
            openContextMenu(event);
        },
        click: function (event) {
            closeContextMenu(event);
        }
    });
}

【问题讨论】：

标签： javascript jquery contextmenu jquery-events

【解决方案1】：

我相信你只是打错了：

closeContextMenu 中的$("custom-menu") 应该有一个 ID 标识符：

$("#custom-menu").hide();

此外，除非isContextMenuOpen 被全局声明，否则它的作用域将保持在openContextMenu，因此hide 方法将永远不会执行。无论如何，您都不需要它，因为无论元素是否可见，hide 都会起作用。

试试这个：

function closeContextMenu(event) {
    $("#custom-menu").hide();
    console.log("Hide the context menu");
}

另外，为了插入我自己的答案，对于一些非常复杂的上下文菜单处理，看看这个：

Use Bootstrap 3 dropdown menu as context menu

【讨论】：

你就在那里，我应该使用 ID 标识符。