javascript - 使用 oncontextmenu 和 js/jquery 左键单击上下文菜单

标签 javascript jquery contextmenu

我有一个表格,通过单击任意行我可以访问上下文菜单

<tr oncontextmenu="return showContextMenu(event,'@item.SomeValue')"  style="cursor: pointer;">

显示上下文菜单的事件如下所示:

var contextMenu = document.getElementById('contextMenu');

 function showContextMenu(event, elemId) {
            contextMenu.style.display = 'block';
            contextMenu.style.left = (event.pageX - 220) + 'px';
            contextMenu.style.top = (event.pageY - 48) + 'px';
        }

以及以这种方式关闭上下文菜单的事件:

window.onclick = hideContextMenu;
function hideContextMenu() {
    contextMenu.style.display = 'none';
}

上下文菜单如下所示:

<div id="contextMenuPasta" class="contextMenu" >
    <ul>
        <li  id="renomearCMid" data-toggle="modal" data-target="#modalRenomearPasta"><span><i class="fa fa-fw fa-pencil" ></i> Renomear Pasta</span></li>
        <li  id="removerCMid"  data-toggle="modal" data-target="#modalExcluirPasta"><span><i class="fa fa-fw fa-trash-o"></i> Remover Pasta</span></li>
        <li  id="adicionarCMid" data-toggle="modal" data-target="#modalNovaPasta"><span><i class="fa fa-fw fa-plus"></i> Adicionar Pasta</span></li>
    </ul>
</div>

有没有办法将鼠标右键更改为左键单击,以显示上下文菜单? 谢谢您的帮助。

最佳答案

我是这样解决问题的:

  1. 在 tr 标记中,我没有使用“oncontextmenu”,而是简单地使用了“onclick”

  2. 删除“hideContextMenu”功能

  3. 相反,使用这个

    window.onclick = function (event) {
        if(event["path"][0].tagName != "TD" ){
            contextMenu.style.display = 'none';
        }
    };
    

关于javascript - 使用 oncontextmenu 和 js/jquery 左键单击上下文菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53283265/

相关文章:

php - 用 PHP 叠加图像

javascript - Bootstrap 日期选择器不关闭

javascript - HTML5 Canvas 变形

jquery - 如何做侧滑子菜单?

javascript - jsTree 和上下文菜单 : modify items

javascript - 如何使用 javascript 访问克隆的 svg 元素

javascript - 如何向用户显示他的真实 IP 地址(在代理之后)

wpf - 如何在 WPF DataGrid 中添加 Column ContextMenu

android - 在不注册 View 的情况下打开上下文菜单

javascript - 向多个设备发送推送 FCM (Web) 无法生成通知 key