如何通过JS、CSS和HTML来禁止用户在页面进行内容复制操作

　　如何通过JS、CSS和HTML来禁止用户在页面进行内容复制操作

　　一般来说，很多网站为了保护页面内容，需要实现禁止用户复制页面内容的操作，或者诱导用户注册，登录后限制复制文本。

　　本文文章教你如何使用JS、CSS和HTML来禁止用户复制页面内容。

　　一、JavaScript 实现

　　我们可以通过JS代码关闭网页的复制事件、剪切事件、内容选择事件甚至右键菜单事件。

　　// 禁止右键菜单

document.oncontextmenu = function(){ return false; };

// 禁止文字选择

document.onselectstart = function(){ return false; };

// 禁止复制

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

// 禁止剪切

document.oncut = function(){ return false; };

　　二、HTML 实现

　　除了上面提到的方法，我们还可以通过设置标签属性直接禁用页面复制和剪切操作：

　　这个方法和JS的实现本质上是一样的。

　　以下JS代码可以恢复页面复制、剪切和内容选择功能：

　　document.body.oncopy = null;

document.body.oncut = null;

document.body.onselectstart = null;

document.body.oncontextmenu = null;

　　三、CSS 实现

　　我们也可以使用CSS样式来禁止页面内容被选中，从而达到限制复制操作的目的：

　　body {

-moz-user-select:none; /* Firefox私有属性 */

-webkit-user-select:none; /* WebKit内核私有属性 */

-ms-user-select:none; /* IE私有属性(IE10及以后) */

-khtml-user-select:none; /* KHTML内核私有属性 */

-o-user-select:none; /* Opera私有属性 */

user-select:none; /* CSS3属性 */

}

　　恢复页面内容选择的功能需要通过JS代码实现：

　　document.body.style.webkitUserSelect = 'auto'; // Firefox

document.body.style.userSelect = 'auto'; // Chrome

//......