用jquery右键单击隐藏图像[重复]答案

【问题标题】：hide images on right click with jquery [duplicate]用jquery右键单击隐藏图像[重复]
【发布时间】：2013-04-24 22:16:22
【问题描述】：

当有人使用右键单击尝试下载图像时，我想将图像隐藏在照片库中。当用户按下普通的左键时，用jquery隐藏一个对象真的很容易，只需添加一个简单的事件

$("document").ready(function(){
    $("img").click(function(event){
       $(this).hide("fast");
    });
});

但是如何检测鼠标右键单击以激活event.preventDefault(); 并对图像设置$(this).hide 操作...

【问题讨论】：

之前有人问过这个问题 - stackoverflow.com/questions/1206203/…。而且你知道用户可以禁用 JS，对吧？
@Terry 甚至不需要禁用 JS，您可以执行以下所有操作：转到工具 > 查看源代码、Ctrl+U、F12 用于 Firebug/DevTools 等。contextmenu 只是个傻瓜障碍:)

标签： jquery image hide right-click

【解决方案1】：

$("document").ready(function(){
    $("img").click(function(event){
        if(event.which === 3) {
            $(this).hide("fast");
        }
    });
});

【讨论】：

这似乎不适用于 Chrome 或 Firefox。 jsbin.com/emotax/2/edit
@c4p - 不！

【解决方案2】：

contextmenu 事件在右键单击时触发，因此通常的快捷方式是使用该事件：

$(document).ready(function(){
    $("img").on('contextmenu', function(event){
       $(this).hide("fast");
    });
});

另一种方法是使用 mousedown 事件，并检查使用了什么按钮：

$("img").on('mousedown', function(event){
    if (event.which === 3)
        $(this).hide("fast");
});

在我的浏览器 (chrome) 中，后一种解决方案不起作用，只有 click 事件，只有 mousedown 事件。

【讨论】：

【解决方案3】：

在你的点击事件中，试试这个，

if (event.which === 3) e.preventDefault();

这看起来很相似。 How to distinguish between left and right mouse click with jQuery

【讨论】：

【解决方案4】：

您可以使用 contextmenu 事件禁用上下文菜单：

$(document).on("contextmenu","img", function(e){
   //hide image ,show alert , etc..
   return false;
});

无论如何，这不会阻止用户将图像保存在页面上。他们仍然可以通过 dom 看到图像 URL 并直接获取它们，或者从浏览器缓存中获取。

【讨论】：