Question

我尝试使用上下文菜单点击左侧菜单按钮，但它无效：

<input type="button" id="selector"  value="click" />

jquery的：

$('#selector').on('click',function(){
 $(this).triggerHandler('contextmenu')   
});

我该如何实施？

请检查这是否有效fiddle

请注意：我想在左键单击时使用默认上下文菜单。

Answer 1

如果您使用的是contextmenu插件，那么您只需使用触发器：'left'进行左键单击。

$(function(){
    $.contextMenu({
        selector: '.context-menu-one', 
        trigger: 'left',
        callback: function(key, options) {
            var m = "clicked: " + key;
            window.console && console.log(m) || alert(m); 
        },
        items: {
            "edit": {name: "Edit", icon: "edit"},
            "cut": {name: "Cut", icon: "cut"},
            "copy": {name: "Copy", icon: "copy"},
            "paste": {name: "Paste", icon: "paste"},
            "delete": {name: "Delete", icon: "delete"},
            "sep1": "---------",
            "quit": {name: "Quit", icon: "quit"}
        }
    });
});

您可以从click here链接

中找到插件详细信息和文档

Answer 2

jsFiddle demo
您无需触发事件，contextMenu可以显示manually。

$( function( windowLoadE ) {
    $( "#selector" ).on( "click", function( clickE ) {
        $( this ).contextMenu( { x: clickE.offsetX, y: clickE.offsetY } );
    } );
    $.contextMenu( {
        selector: "#selector", 
        callback: function( key, options ) {
            var m = "clicked: " + key;
            window.console && console.log( m ) || alert( m ); 
        },
        items: {
            "edit": { name: "Edit", icon: "edit" },
            "cut": { name: "Cut", icon: "cut" },
            "copy": { name: "Copy", icon: "copy" },
            "paste": { name: "Paste", icon: "paste" },
            "delete": { name: "Delete", icon: "delete" },
            "sep1": "---------",
            "quit": { name: "Quit", icon: "quit" }
        }
    } );
} );

或使用trigger option处理左键单击。

Answer 3

$(document) .bind('contextmenu', function (e) {
  e.preventdefault();
  if (event.which == 1) {
    $('#menu') .css({
      top: e.pageY + 'px',
      left: e.pageX + 'px'
    }) .show();
  }
  return false;
});

Answer 4

JavaScript没有权力打开默认的浏览器上下文菜单。

但是，您可以通过简单点击抓住contextmenu事件并触发contextmenu事件：

$('#selector').on('click', function () {
    $(this).triggerHandler('contextmenu');
}).on('contextmenu', function (e) {
    alert('foo');
});

如何在鼠标左键单击时触发上下文菜单？

4 个答案: