如何在后续右键单击时关闭jQuery上下文菜单

Question

我使用了Javascript Toolbox中的jQuery ContextMenu插件，它非常好用。当我在特定区域右键单击时，会打开我想要的上下文菜单，所以它在所有方面都很好，除了一个问题：

当我右键单击打开上下文菜单时，如果另一个菜单仍然打开着，它不会关闭原始的上下文菜单。只要我单击表格的不同行，就会打开新的上下文菜单而不关闭其他菜单。

但是当我左键单击时，它们都会关闭。

如果有帮助或者指导，将不胜感激。

先感谢您！

插件地址：http://www.javascripttoolbox.com/lib/contextmenu/ 编辑：这是调用上下文菜单的代码

$("#sku_table tbody").mousedown(function(event) {
    if (event.which === 3) {

        var sku = $(event.target).closest('tr').attr('id');
        sku = sku.replace('.', '\\.');
        var menu1 = [
            {
            'Open Item information': {
                onclick: function(menuItem, menu) {
                    //Function to open item info
                }
            }}
        ];
        $(function() {
            $('#' + sku).contextMenu(menu1, {
                theme: 'vista'
            });
        });

    }
});​

实际上打开菜单的是 $().contextMenu()。

- npiani

---

请问能否让我看一下你调用上下文菜单的代码？ - BumbleB2na

这就是它！如果你需要其他任何东西，请告诉我！ - npiani

Answer 1

似乎每次在表格主体内右键单击时，都会创建一个新的上下文菜单实例。相反，如果您定义上下文菜单应出现的选择器，则菜单仅会在那里显示。

如果上下文菜单将在随机项目上显示，则应使用类定义这些项目，并且可以从该类实例化上下文菜单。

http://jsfiddle.net/azSMq/

$(function() {
    var menu1 = [
        {
        'Open Item information': {
            onclick: function(menuItem, menu) {
                $(this).fadeOut();
                //Function to open item info
            }
        }}
    ];
    $("#sku_table tr").contextMenu(menu1, {
        theme: 'vista'
    });
});​

- r0m4n

---

谢谢您先生。那很有道理。谢谢！ - npiani

Answer 2

试试这段代码：

$("#sku_table tr").contextMenu(menu1, { theme: 'vista',
    beforeShow: function () {
        $(document).click();
        return true;
    } 
});

强制文档点击将调用插件内部代码，自动隐藏其他上下文菜单。

- James

Answer 3

有趣的是，演示页面在Firefox中似乎按预期工作，但在Chrome或IE中却不是这样。处理这种情况的一种方法是在显示刚刚右键单击的菜单之前隐藏任何打开的菜单。因此，您可以添加以下代码：

$(".context-menu").hide();

在此行后面添加它

if(event.which === 3){

那应该会给你想要的效果。

- David Stetler

---

可以用这种方法解决问题，但只是把问题藏起来，并不能真正解决它。不过还是谢谢你，我之前没有想到过这个方法。 - npiani