Question

当有人使用右键单击尝试下载图片时，我想隐藏图片。当用户按下正常的左键单击，只需添加一个简单的事件

时，使用jquery隐藏对象非常容易

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

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

Answer 1

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

Answer 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事件。

Answer 3

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

if（event.which === 3）e.preventDefault（）;

这看起来像一个类似的。 How to distinguish between left and right mouse click with jQuery

Answer 4

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

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

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

用jquery右键单击隐藏图像

4 个答案: