为了账号安全,请及时绑定邮箱和手机立即绑定

网页禁止复制的实现方法

我们经常在某些网站上复制内容的时候发现,竟然复制不了。友好的交互还会弹窗告诉你,登陆后才能复制哦。那么网站是如何阻止用户复制的呢?

1.JavaScript脚本的方式

通过JavaScript脚本限制复制功能是最常用的方法,具体的实现方式有以下几种:

// 禁用右键菜单、复制、选择$(document).bind("contextmenu copy selectstart", function() {  return false;
});
// 禁用Ctrl+C和Ctrl+V(所有浏览器均支持)$(document).keydown(function(e) {  if(e.ctrlKey && (e.keyCode == 65 || e.keyCode == 67)) {    return false;
  }
});

2.CSS的方式

使用CSS能够保证在用户禁用JavaScript脚本的情况下,复制功能也会被禁止。实现方式如下:

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属性 */}

3.HTML属性的方式

HTML的标签提供了一些属性来禁用或开启复制功能。禁止复制和剪切:

oncopy="return false;"

oncut="return false;"
实现方式如下:

<body oncopy="return false" oncut="return false;" onselectstart="return false" >    

关于页面禁止复制的功能实现就介绍到这里了,欢迎你关注我的专栏。



作者:魏永_Owen_Wei
链接:https://www.jianshu.com/p/5550da3fad49


点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消