HTML技巧篇——禁止网页元素被右击、拖动、选中、复制

杨不旧

已于 2022-02-19 14:31:40 修改

阅读量3.5k

点赞数 4

分类专栏： JavaScript 文章标签： html javascript 前端

于 2021-12-20 09:03:00 首次发布

本文链接：https://blog.csdn.net/qq_45152044/article/details/122033827

版权

JavaScript 专栏收录该内容

26 篇文章

订阅专栏

本文介绍了几种使用JavaScript和CSS防止网页内容被选中、复制及拖拽的方法，包括禁止选中、禁止右键菜单等实用技巧。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

利用JS禁止方法：

1、网页内容不可选中
document.onselectstart=function(){return false}

2、网页内容禁止鼠标右键
document.oncontextmenu=function(){return false}

3、内容禁止鼠标拖动
document.ondragstart=function(){return false}

4、网页内容禁止复制文本
document.onselect=function(){return false}

CSS禁用方法：

1、内联禁用

<p onselectstart="return false" onselect="document.selection.empty()">
这段文字不能被鼠标选中和复制
</p>

2、外联、内嵌禁用

p{
 -moz-user-select:none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -khtml-user-selece:none;
  /*上面都是兼容性问题，具体看浏览器版本或什么浏览器*/
  user-select: none;/*内容禁止选中*/
}

个人觉得js方法好用