blocks|key|816085|text|您禁用右键单击的目的是什么。任何技术的问题在于，总有一种方法可以绕过它们。firefox+(firebug)和chrome的控制台允许解除绑定该事件。或者，如果您希望图像受到保护，您可以始终只查看图像的临时缓存。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|816086|如果你想创建你自己的上下文菜单，preventDefault是不错的选择。就在这里选择你的战斗吧。即使像tnyMCE这样的大型JavaScript库也不能在所有浏览器上运行...这并不是因为这不可能;-)。|816087|$(document).bind("contextmenu",function(e){
++e.preventDefault()
});|code-block|syntax|javascript|816088|就我个人而言，我更倾向于开放互联网。本机浏览器行为不应受到页面交互的阻碍。我确信，可以找到其他不是右键单击的交互方式。|816089|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|N|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|O|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|P|8|@]|9|@]|A|$]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

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.

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 ;-).

<pre><code>$(document).bind("contextmenu",function(e){
 e.preventDefault()
});
</code></pre>

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.

blocks|key|816139|text|是否有可能保留右键单击和下载的能力，当完成时，在图像上放置一个单独的水印。当然，这不会阻止屏幕截图，但我认为这可能是一个很好的中间地带。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|816140|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

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.

blocks|key|1031058|text|在chrome和firefox中，除非我使用'live‘而不是'bind’，否则上述方法不起作用。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1031059|这对我很有效：|1031060|$('img').live('contextmenu',+function(e){
++++return+false;
});|code-block|syntax|javascript|1031061|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

In chrome and firefox the methods above didn't work unless I used 'live' instead of 'bind'.

This worked for me:

<pre><code>$('img').live('contextmenu', function(e){
 return false;
});
</code></pre>

blocks|key|1031082|text|你可以试试这个：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1031083|var+message="Sorry,+right-click+has+been+disabled";

function+clickIE()+{
++++if+(document.all)+{
++++++++(message);
++++++++return+false;
++++}
}

function+clickNS(e)+{
++++if+(document.layers+%7C%7C+(document.getElementById+&&+!document.all))+{
++++++++if+(e.which+==+2%7C%7Ce.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")|code-block|syntax|javascript|1031084|Checkout+a+demo+here|offset|length|1031085|entityMap|0|LINK|mutability|MUTABLE|url|http://www.zararsiz.at/^0|0|0|0|K|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|T|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|U|8|@]|9|@$I|V|J|W|1|X]]|A|$]]|$1|K|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|L|$M|$5|N|O|P|A|$Q|R]]]]

You could try this :

<pre><code>var message="Sorry, right-click has been disabled";

function clickIE() {
 if (document.all) {
 (message);
 return false;
 }
}

function clickNS(e) {
 if (document.layers || (document.getElementById &amp;&amp; !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")
</code></pre>

<a href="http://www.zararsiz.at" rel="nofollow">Checkout a demo here</a>

blocks|key|1031117|text|一种非常简单的方法是将图像作为背景添加到DIV，然后加载一个空的透明gif集，其大小与前景中的DIV相同。这让那些不那么坚定的人置身事外。如果不查看代码并复制URL并单击鼠标右键下载透明的gif，他们就无法获得背景。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1031118|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

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.

blocks|key|1031158|text|在不使用jQuery的情况下，更好的方法是：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1031159|const+images+=+document.getElementsByTagName('img');
for+(let+i+=+0;+i+<+images.length;+i%2B%2B)+{
++++images[i].addEventListener('contextmenu',+event+=>+event.preventDefault());
}|code-block|syntax|javascript|1031160|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

The better way of doing this without jQuery:

<pre><code>const images = document.getElementsByTagName('img');
for (let i = 0; i &lt; images.length; i++) {
 images[i].addEventListener('contextmenu', event =&gt; event.preventDefault());
}
</code></pre>

blocks|key|816292|text|这应该是可行的|type|unstyled|depth|inlineStyleRanges|entityRanges|data|816293|$(function(){
+++++$('body').on('contextmenu',+'img',+function(e){+
+++++++++return+false;+
+++++});
+});|code-block|syntax|javascript|816294|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

This should work

<pre><code>$(function(){
 $('body').on('contextmenu', 'img', function(e){ 
 return false; 
 });
 });
</code></pre>

blocks|key|1031258|text|对于现代浏览器，你所需要的就是这个CSS：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1031259|img+{
++++pointer-events:+none;
}|code-block|syntax|javascript|1031260|较老的浏览器仍然允许在图像上发生指针事件，但是上面的CSS将照顾到您站点的绝大多数访问者，并且与contextmenu方法结合使用将为您提供一个非常可靠的解决方案。|offset|length|style|CODE|1031261|entityMap^0|0|0|1C|B|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@$I|R|J|S|K|L]]|9|@]|A|$]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

For modern browsers all you need is this CSS:
<pre><code>img {
 pointer-events: none;
}
</code></pre>
Older browsers will still allow pointer events on the images, but the CSS above will take care of the vast majority of visitors to your site, and used in conjunction with the <code>contextmenu</code> methods should give you a very solid solution.

I want to know how to disable right click on images using jQuery.

I know only this:

<pre><code>&lt;script type="text/javascript" language="javascript"&gt;
 $(document).ready(function() {
 $(document).bind("contextmenu",function(e) {
 return false;
 });
 }); 
&lt;/script&gt;
</code></pre>

Disabling right click on images using jquery

jQuery

我想知道如何使用jQuery禁用右击图像。我只知道：<script type="text/javascript" language="javascript"> $(document).ready(function() { $(document).bind("contextmenu",function...

问禁用使用jquery右键单击图像
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问禁用使用jquery右键单击图像EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问禁用使用jquery右键单击图像
EN