html禁止复制文字
# 禁止设置
# 禁止鼠标右键、禁止全选、复制、粘贴
oncontextmenu事件禁用右键菜单； js代码：
document.oncontextmenu = function(){
event.returnValue = false;
}
document.oncontextmenu = function(){// 或者直接返回整个事件
return false;
}
1
2
3
4
5
6
2
3
4
5
6
onselectstart事件禁用网页上选取的内容； js代码：
document.onselectstart = function(){
event.returnValue = false;
}
document.onselectstart = function(){// 或者直接返回整个事件
return false;
}
1
2
3
4
5
6
2
3
4
5
6
oncopy事件禁用复制；
document.oncopy = function(){
event.returnValue = false;
}
document.oncopy = function(){// 或者直接返回整个事件
return false;
}
1
2
3
4
5
6
2
3
4
5
6
以上三种事件，如果只想单纯的禁用鼠标右键，和复制粘贴，还可以将它们直接写到HTML中的body上面；
<body oncontextmenu = "return false" ></body>
<body onselectstart = "return false" ></body>
<body oncopy = "return false" ></body>
1
2
3
2
3
禁用鼠标事件
document.onmousedown = function(e){
if ( e.which == 2 ){// 鼠标滚轮的按下，滚动不触发
return false;
}
if( e.which==3 ){// 鼠标右键
return false;
}
}
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
禁用键盘中的ctrl、alt、shift
document.onkeydown = function(){
if( event.ctrlKey ){
return false;
}
if ( event.altKey ){
return false;
}
if ( event.shiftKey ){
return false;
}
}
1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
# 禁用选中和右键
在<body>标签中添加以下代码：
οncοntextmenu='return false' //禁止右键
οndragstart='return false' //禁止拖动
onselectstart ='return false' //禁止选中
οnselect='document.selection.empty()' //禁止选中
οncοpy='document.selection.empty()' //禁止复制
onbeforecopy='return false' //禁止复制
οnmοuseup='document.selection.empty()'
1
2
3
4
5
6
7
2
3
4
5
6
7
如下：
<body leftmargin=0 topmargin=0 oncontextmenu='return false' ondragstart='return false' onselectstart ='return false' onselect='document.selection.empty()' oncopy='document.selection.empty()' onbeforecopy='return false' onmouseup='document.selection.empty()'>
1
# 禁止网页另存为
在<body>后面加入以下代码：
<noscript>
<iframe src="*.htm"></iframe>
</noscript>
1
2
3
2
3
这时在电脑端已经无法选择复制，但是在移动端还可以选中复制，再添加以下css代码用来禁止选中文字。
*{
moz-user-select: -moz-none;
-moz-user-select: none;
-o-user-select:none;
-khtml-user-select:none;
-webkit-user-select:none;
-ms-user-select:none;
user-select:none;
}
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9
这时正常的选择复制都已经被禁用但是还可以用浏览器的查看源码和调试工具来直接从代码中复制内容。
# 禁用F12按键
window.onkeydown = window.onkeyup = window.onkeypress = function (event) {
// 判断是否按下F12，F12键码为123
if (event.keyCode == 123) {
event.preventDefault(); // 阻止默认事件行为
window.event.returnValue = false;
}
}
1
2
3
4
5
6
7
2
3
4
5
6
7
# 禁用调试工具
var threshold = 160; // 打开控制台的宽或高阈值
var check = setInterval(function() {// 每秒检查一次
if (window.outerWidth - window.innerWidth > threshold ||
window.outerHeight - window.innerHeight > threshold) {
// 如果打开控制台，则刷新页面
window.location.reload();
}
}, 1000);
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
至此，已经限制了大部分的复制功能，但是还不能彻底禁止
# vue禁止复制
# 全局设置
<script>
export default {
created() {
this.$nextTick(() => {
// 禁用右键
document.oncontextmenu = new Function("event.returnValue=false");
// 禁用选择
document.onselectstart = new Function("event.returnValue=false");
});
//document.onselectstart = function () { return false; }
}
};
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
# 事件拦截
# 禁止复制
在对应的标签上添加@copy.native.capture.prevent='handCopy'
# 禁止粘贴
在对应的标签上添加@paste.native.capture.prevent='handPaste'
handCopy/handPaste () {
console.log('禁止粘贴')
return false
}
1
2
3
4
2
3
4
# 相关链接
上次更新: 2022/04/15, 05:41:26