断舍离,永远去做你余生最重要的那件事

首页前端开发正文

利用javascript的oncopy事件来防止页面内容被复制

朱绪2017-06-121535JavaScript

有的网站不想内容被复制,毕竟是自己原创的内容嘛。

那么,可以使用什么技术来实现这种效果呢?

我们可以使用js的oncopy事件来达到这种效果。

语法是:

document.body.oncopy=function(){
    return false;
}

举个例子吧,这样更直观:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script>
        window.onload=function(){
            document.body.oncopy=function(){
                return false;
            }
        }  
    </script>
</head>
<body>
    <div>只要专注,才能成功</div>
</body>
</html>

浏览器预览效果是这样的:

利用javascript的oncopy事件来防止页面内容被复制

大家或许会感到困惑,选取文本然后鼠标右键,【复制】这个选项依然可以点击。

但实际上,就算点击复制了粘贴是粘贴不出来内容的。