Question

我已经做了这个小提琴，使调试更容易 - ＆gt; https://jsfiddle.net/ayo8voh2/

JS：

jQuery('.edit-view-submenu').mousedown(function(event) {
    if (event.which === 3) { // right mouse clicked
    // disable default menu
    jQuery(this).bind('contextmenu', function() {
      return false;
    });

    jQuery(this).find('.mdl-button').trigger('click');
  }
});

HTML：

            <div class="edit-view-submenu">
                <button id="edit-context"
                        class="mdl-button mdl-js-button mdl-button--icon float-right">
                    <i class="material-icons">more_vert</i>
                </button>

                <ul class="mdl-menu mdl-menu--bottom-left mdl-js-menu mdl-js-ripple-effect"
                    for="edit-context">
                    <li class="mdl-menu__item">Show</li>
                    <li class="mdl-menu__item">Show 2</li>
                    <li class="mdl-menu__item">Show 3</li>
                    <li class="mdl-menu__item">Show 4</li>
                </ul>
            </div>

我想要做的是当用户点击菜单按钮时单击鼠标右键，禁用默认浏览器上下文菜单并触发默认鼠标左键单击（以便打开mdl上下文菜单）。

重新创建问题：

1）首先在Chrome中打开小提琴，然后用鼠标右键单击菜单图标（3个点） - 注意它是如何打开菜单的; 2）现在在Firefox中打开相同的小提琴并执行相同的操作 - 注意菜单如何打开并立即关闭; （如果用鼠标右键单击并按住，它将保持打开状态。另外，如果用鼠标右键单击然后将光标移动到打开的菜单，它也将保持打开状态。

我无法找到解决方案，因为这个bug（？）对我来说真的很奇怪。也许你们知道Firefox有什么东西，我不知道吗？

可以通过定位菜单来解决这个问题，这样当它打开时，它会在鼠标光标所在的地方打开 - 然后它不会消失，但它不是正常修复，而更像是一个“丑陋的修补程序”

感谢您查看此内容并进行了一次精彩的调试（如果需要的话）。

Answer 1

我意识到这个问题现在真的处于休眠状态，并且我已经在Firefox中尝试过了，该问题似乎不再发生了，但是我相信我已经找到了原因，因此找到了答案。

TL; DR-在创建的新菜单上检测到另一次右键单击。

对于上下文：我的情况略有不同，因为当用户右键单击画布类型区域时，我希望在鼠标位置弹出一个窗口。我创建了右键单击菜单，并且一切正常，直到将菜单与鼠标的实际位置对齐为止-然后，我还将获得默认的上下文菜单（与您所描述的问题相同）。因此，请澄清一下-代码在菜单位于屏幕左上角时有效-在菜单位于鼠标位置时不起作用我的情况给了我提示-当菜单出现在光标下方时会发生问题-因此这里发生了什么。我在所有div上添加了一堆附加的侦听器，发现以及该空间上的最初的mousedown事件，新显示的菜单上触发了“ mouseup”-而且我猜想相应的mousedown只有几毫秒较早之前，我的浏览器（对我而言是Chrome）奇怪地是将其拼凑在一起，方法是右键单击此元素。添加了：

$(this).bind('contextmenu', function() {
    return false;
});

进入mouseup事件（请记住，这在实际的菜单项上，即ul.mdl-menu上），一切正常。

意识到OP的问题可能为时已晚，但是如果有人偶然发现此问题，希望对您有所帮助！

MDL菜单单击打开，右键单击错误

1 个答案: