jquery / JS阻止浏览器中的右键单击菜单

我有我的div与右键单击popup式菜单:

// 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(); } }); 

但这个元素的浏览器仍然popup默认菜单(复制/粘贴/属性等)。 任何方式来禁用这个? 我试过返回错误,但不是运气。

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

 <body oncontextmenu="return false;"> 

你可以禁用任何你想要的元素的上下文菜单:

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

要完全禁用页面上的上下文菜单(感谢Ismail),请使用以下命令:

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

一个jQuery线:

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

尝试这个:

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

尝试…

 $('[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(); } }); 

如果你有这些盒子的dynamic创build,那么…

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

使用jQuery:

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

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

 $(document).bind("contextmenu",function(e){ return false; }); 
 // 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(); } }); 

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

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

但是如果你想要更好的控制呢?

我有一个类似的问题,我想我已经find了一个很好的解决scheme:为什么不直接将你的上下文菜单代码附加到你想处理的特定元素的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 }); 

因此,您可以避免处理两个不同的事件来捕获上下文菜单并对其进行自定义:)

当然,这个假定你不介意当有人点击你没有select的元素时显示标准的上下文菜单。 你可能会显示不同的上下文菜单取决于用户右键单击的位置。

HTH

为了我

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

jQuery做的工作:)