在HTML中禁止文字复制是常见的版权保护和内容控制需求，一般可以通过css或者JavaScript来实现
一、CSS 禁止文本选择
通过 user-select: none 属性可阻止用户选中文本，需添加浏览器前缀保证兼容性
.unselectable {
-webkit-user-select: none; /* Chrome/Safari/Opera */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE/Edge */
user-select: none; /* 标准语法 */
}
应用场景：保护版权内容展示（如付费文章预览）
二、JavaScript 事件拦截
1. 禁用复制操作
监听 copy 事件并阻止默认行为
document.addEventListener('copy', e => e.preventDefault());
2. 禁用右键菜单
阻止通过右键菜单复制
document.addEventListener('contextmenu', e => e.preventDefault());
3. 禁用文本选中
通过 selectstart 事件拦截
document.onselectstart = () => false;
三、HTML 属性控制
在元素上直接添加事件属性实现快速禁用
<body
oncontextmenu="return false"
onselectstart="return false"
oncopy="return false">
</body>
四、直接在body标签中写入如下代码，即可实现在html中禁止文字的复制：
<body oncontextmenu='return false' ondragstart='return false' onselectstart ='return false' onselect='document.selection.empty()' oncopy='document.selection.empty()' onbeforecopy='return false' onmouseup='document.selection.empty()'>
其中各个事件的意义是：
- oncontextmenu: 单禁用右键菜单 , oncontextmenu='return false': 来取消鼠标右键
- ondragstart: 事件在用户开始拖动元素或选择的文本时触发 return false:禁止鼠标在网页上拖动
- onselectstart="return false" 禁止选中网页上的内容
- onselect:事件会在文本框中的文本被选中时发生。 onselect="SomeJavaScriptCode" ,必需规定该事件发生时执行的 JavaScript。 document.selection.empty():表示文本框被选中时为空
- oncopy="return false" 防复制用户在网页上选中的内容
- onbeforecopy():默认动作的事件源对象上被取消。
- onmouseup：事件会在鼠标按键被松开时发生。 onmouseup="SomeJavaScriptCode"，同onselect一样，必需规定该事件发生时执行的 JavaScript。
document.selection.empty()：表示文本框被选中时为空 可以将这些代码粘贴试试。
五、综合解决方案
结合CSS和JS实现更全面的保护
- 使用CSS禁用文本选择
- 通过JS拦截复制/右键事件
- 添加透明遮罩层防止直接点击选择