Javascript 使用 jquery 禁用右键单击图像
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/4753695/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Disabling right click on images using jquery
提问by Bat_Programmer
I want to know how to disable right click on images using jQuery.
我想知道如何使用 jQuery 禁用右键单击图像。
I know only this:
我只知道这个：
<script type="text/javascript" language="javascript">
$(document).ready(function() {
$(document).bind("contextmenu",function(e) {
return false;
});
});
</script>
回答by Jacob Relkin
This works:
这有效：
$('img').bind('contextmenu', function(e) {
return false;
});
Or for newer jQuery:
或者对于较新的 jQuery：
$('#nearestStaticContainer').on('contextmenu', 'img', function(e){
return false;
});
回答by yopefonic
what is your purpose of disabling the right click. problem with any technique is that there is always a way to go around them. the console for firefox (firebug) and chrome allow for unbinding of that event. or if you want the image to be protected one could always just take a look at their temporary cache for the images.
您禁用右键单击的目的是什么。任何技术的问题是总有办法绕过它们。firefox (firebug) 和 chrome 的控制台允许解除该事件的绑定。或者，如果您希望图像受到保护，您可以随时查看图像的临时缓存。
If you want to create your own contextual menu the preventDefault is fine. Just pick your battles here. not even a big JavaScript library like tnyMCE works on all browsers... and that is not because it's not possible ;-).
如果您想创建自己的上下文菜单， preventDefault 很好。只需在这里选择您的战斗。甚至像 tnyMCE 这样的大型 JavaScript 库都无法在所有浏览器上运行……这并不是因为它不可能;-)。
$(document).bind("contextmenu",function(e){
e.preventDefault()
});
Personally I'm more in for an open internet. Native browser behavior should not be hindered by the pages interactions. I am sure that other ways can be found to interact that are not the right click.
就个人而言，我更喜欢开放的互联网。本机浏览器行为不应受到页面交互的阻碍。我确信可以找到其他不是右键单击的交互方式。
回答by Prince Antony G
For Disable Right Click Option
对于禁用右键单击选项
<script type="text/javascript">
var message="Function Disabled!";
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}
function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}
if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}
document.oncontextmenu=new Function("alert(message);return false")
</script>
回答by Emz
In chrome and firefox the methods above didn't work unless I used 'live' instead of 'bind'.
在 chrome 和 firefox 中，除非我使用“live”而不是“bind”，否则上述方法不起作用。
This worked for me:
这对我有用：
$('img').live('contextmenu', function(e){
return false;
});
回答by EZDC
Would it be possible to leave the ability to right click and download just when done a separate watermark is placed on the image. Of course this won't prevent screen shots but thought it may be a good middle ground.
是否可以在完成后在图像上放置单独的水印时保留右键单击和下载的功能。当然，这不会阻止屏幕截图，但认为这可能是一个很好的中间立场。
回答by Serkan
You could try this :
你可以试试这个：
var message="Sorry, right-click has been disabled";
function clickIE() {
if (document.all) {
(message);
return false;
}
}
function clickNS(e) {
if (document.layers || (document.getElementById && !document.all)) {
if (e.which == 2||e.which == 3) {
(message);
return false;
}
}
}
if (document.layers) {
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown = clickNS;
} else {
document.onmouseup = clickNS;
document.oncontextmenu = clickIE;
}
document.oncontextmenu = new Function("return false")
回答by Chris
A very simple way is to add the image as a background to a DIV then load an empty transparent gif set to the same size as the DIV in the foreground. that keeps the less determined out. They cant get the background without viewing the code and copying the URL and right clicking just downloads the transparent gif.
一个非常简单的方法是将图像作为背景添加到 DIV，然后加载一个空的透明 gif 设置为与前景中的 DIV 相同的大小。这让那些不太确定的人保持沉默。他们无法在不查看代码和复制 URL 的情况下获取背景，然后右键单击只会下载透明的 gif。
回答by Hassan Azimi
The better way of doing this without jQuery:
不使用 jQuery 的更好方法：
const images = document.getElementsByTagName('img');
for (let i = 0; i < images.length; i++) {
images[i].addEventListener('contextmenu', event => event.preventDefault());
}
回答by Mohamad Hamouday
This should work
这应该工作
$(function(){
$('body').on('contextmenu', 'img', function(e){
return false;
});
});
