Question

我的div有一个右键单击弹出菜单：

// Attatch right click event to folder for extra options
$('#fBox' + folderID).mousedown(function(event) {
    if (event.which == 3) {

        // Set ID
        currRClickFolder = folderID;

        // Calculate position to show popup menu
        var height = $('#folderRClickMenu').height();
        var width = $('#folderRClickMenu').width();
        leftVal = event.pageX - (width / 2) + "px";
        topVal = event.pageY - (height) + "px";
        $('#folderRClickMenu').css({ left: leftVal, top: topVal }).show();

    }
});

但是这个元素的浏览器仍会弹出默认菜单（复制/粘贴/属性等）。有什么方法可以禁用它吗？我试过回复假，但没有运气。

Answer 1

您可以通过附加oncontextmenu =“return false”来禁用右键单击;到你的身体标签。

<body oncontextmenu="return false;">

Answer 2

您可以在所需的任何元素上禁用上下文菜单：

$('selector').contextmenu(function() {
    return false;
});

要完全禁用页面上的上下文菜单（感谢Ismail），请使用以下命令：

$(document).contextmenu(function() {
    return false;
});

Answer 3

一个jQuery行：

$('[id^="fBox"]').on("contextmenu", function(evt) {evt.preventDefault();});

Answer 4

试试这个：

$('#fBox' + folderID).bind("contextmenu", function () {
                alert("Right click not allowed");
                return false;
            });

Answer 5

...试

$('[id^="fBox"]').mousedown(function(event) {
    if (event.which == 3) {
        event.preventDefault();
        // Set ID
        currRClickFolder = $(this).attr('id').replace('fBox','');

        // Calculate position to show popup menu
        var height = $('#folderRClickMenu').height();
        var width = $('#folderRClickMenu').width();
        leftVal = event.pageX - (width / 2) + "px";
        topVal = event.pageY - (height) + "px";
        $('#folderRClickMenu').css({ left: leftVal, top: topVal }).show();

    }
});

如果您有动态创建这些框，那么......

$('[id^="fBox"]').live('mousedown',function(event) {
    ...
});

Answer 6

现在，这是浏览器的默认行为，用于禁用备用点击覆盖。每个用户必须在最近的浏览器中允许此行为。例如，我不允许这种行为，因为我总是想要我的默认弹出菜单。

Answer 7

使用jQuery：

$('[id^="fBox"]').bind("contextmenu",function(e){
    return false;
});

或者在整个页面上禁用上下文菜单：

$(document).bind("contextmenu",function(e){
    return false;
});

Answer 8

我同意@aruseni，在正文级阻止oncontextmenu，你将避免右键单击页面中每个元素的标准上下文菜单。

但是如果你想拥有更好的控制呢？

我遇到了类似的问题，我认为我找到了一个很好的解决方案：为什么不直接将上下文菜单代码附加到您想要处理的特定元素的contextmenu事件中？像这样：

// Attatch right click event to folder for extra options
$('#fBox' + folderID).on("contextmenu", function(event) {
  // <-- here you handle your custom context menu
  // Set ID
  currRClickFolder = folderID;

  // Calculate position to show popup menu
  var height = $('#folderRClickMenu').height();
  var width = $('#folderRClickMenu').width();
  leftVal = event.pageX - (width / 2) + "px";
  topVal = event.pageY - (height) + "px";
  $('#folderRClickMenu').css({ left: leftVal, top: topVal }).show();

  event.stopImmediatePropagation();
  return false; // <-- here you avoid the default context menu
});

因此，您可以避免处理两个不同的事件，只是为了捕获上下文菜单并对其进行自定义：）

当然，这假设您不介意在有人点击您未选择的元素时显示标准上下文菜单。您可以根据用户右键单击的位置显示不同的上下文菜单。

HTH

Answer 9

// Attatch right click event to folder for extra options
$('#fBox' + folderID).mousedown(function(event) {
    if (event.which == 3) {
        event.preventDefault();
        // Set ID
        currRClickFolder = folderID;

        // Calculate position to show popup menu
        var height = $('#folderRClickMenu').height();
        var width = $('#folderRClickMenu').width();
        leftVal = event.pageX - (width / 2) + "px";
        topVal = event.pageY - (height) + "px";
        $('#folderRClickMenu').css({ left: leftVal, top: topVal }).show();

    }
});

Answer 10

对我来说

$('body').on('contextmenu',function(){return false;});

jQuery完成工作：）

Answer 11

这是我最近使用的一种方式（使用一些小jQuery），当我遇到问题时。由于mousedown事件发生在contextmenu之前，这个技巧似乎抓住它，它附加了一个body级oncontextmenu处理程序，暂时在mousedown事件中返回false，执行你想要的动作，然后作为一个重要的部分，记得以后删除处理程序

这只是我提取的代码的一部分，作为示例......

$(div)
    .mousedown(function (e) {
        if (!leftButtonPressed(e)) {
            disableContextMenu(true);
            showOptions({ x: e.clientX, y: e.clientY }, div); // do my own thing here
        }
    });

当我的showoptions（）rtn完成时，会运行一个回调函数并再次调用disable-rtn，但是＆＃39; false＆＃39;：

disableContextMenu(false);

这是我的disableContextMenu（）rtn：

function disableContextMenu(boolDisable, fn) {
    if (boolDisable) {
        $(document).contextmenu(function (e) {
            if (fn !== undefined) {
                return fn(e);
            } else {
                return false;
            }
        });
    } else {
        $(document).prop("oncontextmenu", null).off("contextmenu");
    }
}

Answer 12

有许多Javascript代码段可用于禁用右键单击上下文菜单，但是JQuery使事情变得简单得多：

    $(document).bind("contextmenu",function(e){
        return false;
    });
});

Jquery / JS阻止了浏览器中的右键菜单

12 个答案: