屏蔽网页鼠标右键或键盘F12并解除屏蔽的方法

很多时候我们的网站内容会被别人拿过去做伪原创,这样就比较难受了,自己辛辛苦苦写了大半天结果被别人直接复制黏贴了,为了避免这样的悲剧频繁发生,很多人给自己的网站添加了屏蔽鼠标右键和 F12 键的 js 代码,例如下面是用 jQuery 实现的一段屏蔽鼠标右键的代码:

1
2
3
4
5
$(document).ready(function(){  
    $(document).bind("contextmenu",function(e){   
          return false;   
    });
});

不使用 jQuery 可以修改如下等效的代码:

1
2
3
4
<script language="JavaScript">
     document.οncοntextmenu=new Function("event.returnValue=false;");
     document.onselectstart=new Function("event.returnValue=false;");
</script>

屏蔽键盘的 F12 回车键和退格键

上面演示了最基本的屏蔽方法,这里我们添加一个对键盘的 F12 键响应的屏蔽,我们通过获取窗口对象模型的事件对象 eventkeyCode 来判断是键盘的那个键。

Event.returnValue 属性表示该事件的默认操作是否已被阻止。默认情况下,它被设置为 true,允许发生默认操作。将该属性设置为 false,可以防止默认操作。

我们可以去 Web API 接口文档中查询 keyCode 的定义, 链接地址:https://developer.mozilla.org/zh-CN/docs/Web/API/KeyboardEvent/keyCode

keyCode 的值是 123 表示键盘的 F12, keyCode 的值是 13 表示键盘的回车键, keyCode 的值是 8 表示键盘的 BackSpace 退格键。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
document.onkeydown = function(){
    if(window.event && window.event.keyCode == 123) {
        alert("F12被禁用");
        event.keyCode=0;
        event.returnValue=false;
    }
    if(window.event && window.event.keyCode == 13) {
        window.event.keyCode = 505;
        window.event.returnValue=false;
    }
    if(window.event && window.event.keyCode == 8) {
        alert(str+"\n请使用Del键进行字符的删除操作!");
        window.event.returnValue=false;
    }
}

屏蔽右键菜单

同上面的道理一样,我们可以获取 window.event 对象的 srcElement 属性来判断屏蔽鼠标的右键操作。

Event.srcElement 是标准的 Event.target 属性的一个别名。它只对老版本的IE浏览器有效。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
document.oncontextmenu = function (event){
    if(window.event){
        event = window.event;
    }
    try{
        var the = event.srcElement;
        if (!((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")){
            return false;
        }
        return true;
    } catch (e){
        return false;
    }
}

屏蔽选中

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
document.onselectstart = function (event){
    if(window.event){
        event = window.event;
    }
    try{
        var the = event.srcElement;
        if (!((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")){
            return false;
        }
        return true;
    } catch (e) {
        return false;
    }
}

屏蔽复制

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
document.oncopy = function (event){
    if(window.event){
        event = window.event;
    }
    try{
        var the = event.srcElement;
        if(!((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")){
            return false;
        }
        return true;
    } catch (e){
        return false;
    }
}

屏蔽剪贴

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
document.oncut = function (event){
    if(window.event){
        event = window.event;
    }
    try{
        var the = event.srcElement;
        if(!((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")){
            return false;
        }
        return true;
    } catch (e){
        return false;
    }
}

屏蔽粘贴

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
document.onpaste = function (event){
    if(window.event){
        event = window.event;
    }
    try{
        var the = event.srcElement;
        if (!((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")){
            return false;
        }
        return true;
    } catch (e){
        return false;
    }
}

转载请说明出处,本文出自水寒的个人博客:https://dp2px.com

解除网页右键屏蔽

在 Chrome 上面新建一个书签,网址栏输入如下代码:

1
javascript:(function() { function R(a){ona = "on"+a; if(window.addEventListener) window.addEventListener(a, function (e) { for(var n=e.originalTarget; n; n=n.parentNode) n[ona]=null; }, true); window[ona]=null; document[ona]=null; if(document.body) document.body[ona]=null; } R("contextmenu"); R("click"); R("mousedown"); R("mouseup"); R("selectstart");})()

保存后就可以了,遇到屏蔽右键的网页时点击一下这个书签就解锁了。

其实还有更省事的,那就是安装浏览器插件, Chrome 浏览器安装插件 “Right-Click enabler”, Firefox浏览器安装插件“快乐右键”。