Jquery禁止鼠标右键菜单

最新推荐文章于 2021-04-13 17:04:40 发布

avoidaily

最新推荐文章于 2021-04-13 17:04:40 发布

阅读量713

点赞数

分类专栏：用心软件

原文链接：https://www.cnblogs.com/xielong/p/9713012.html

版权

用心软件专栏收录该内容

16 篇文章 0 订阅

订阅专栏

$(document).ready(function(){
    $(document).bind("contextmenu",function(e){
        return false;
    });
});

// 禁用了右键以后点击右键什么都么有了，用户体验总会觉得缺点什么，那么就在右键里面自定义一些小效果。
$(document).bind("contextmenu",function(e){
	//在这里书写代码，构建个性右键化菜单
	return false;
});

// 还可以让用户不能选中页面中的文字，下面这段代码可以搞定
$('body').bind("selectstart",function(){
	return false;
});

注：bind事件处理功能为：为每一个匹配元素的特定事件（像click）绑定一个事件处理器函数。
参考：https://blog.csdn.net/iteye_13416/article/details/82364570

// 切换是否可以右键

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>屏蔽鼠标右键菜单</title>
</head>
<script type="text/javascript" src="jquery.min.js"></script>
<script>
    $(function(){
        //contextmenu事件返回false则屏蔽鼠标右键菜单
        $(document).bind("contextmenu",function(e){
                if($("#enabledRadio").prop("checked")){
                    return true;    
                }
                if($("#disabledRadio").prop("checked")){
                    return false;    
                }
            });
    })
</script>
<body>
    <div>
        <h3>JQuery屏蔽鼠标右键菜单</h3>
        <input type="radio" name="control" id="enabledRadio" checked="checked" />允许右键
        <input type="radio" name="control" id="disabledRadio" />禁止右键
    </div>
</body>
</html>

查看效果图
1）允许右键
在这里插入图片描述
2）禁止右键