js来监控复制粘贴
平时我们在复制网页上面代码到控制台调试时,有时会出现复制过来的代码后面加上了一下描述信息(作者、版权等信息),每次需要删除才能运行,所以今天看看怎么能保证我们粘贴的代码不携带这些信息呢?
(function() {
document.addEventListener('copy',(e)=>{
e.preventDefault();
e.stopPropagation();
console.info('触发复制事件');
/**
返回一个Selection对象,表示用户选择的文本范围或光标的当前位置
Selection.getRangeAt返回一个包含当前选区内容的区域对象
*/
let text = window.getSelection().getRangeAt(0);
let node = document.createElement('div');
// cloneContents方法把范围(Range)的内容复制到一个DocumentFragment对象
node.appendChild(window.getSelection().getRangeAt(0).cloneContents());
/**
ClipboardEvent.clipboardData 属性保存了一个 DataTransfer 对象,这个对象可用于:
描述哪些数据可以由 cut 和 copy 事件处理器放入剪切板,通常通过调用 setData(format, data) 方法;
获取由 paste 事件处理器拷贝进剪切板的数据,通常通过调用 getData(format) 方法
*/
if(e.clipboardData){
e.clipboardData.setData("text/html", node.innerHTML);
e.clipboardData.setData("text/plain",text);
}else if(window.clipboardData){
return window.clipboardData.setData("text", text);
}
})
}());
js来监控复制粘贴的更多相关文章
- Cocos Creator JS web平台复制粘贴代码(亲测可用)
Cocos Creator JS web平台复制粘贴代码(亲测可用) 1 webCopyString: function(str){ var input = str; const el = docum ...
- fabric.js 翻转,复制粘贴,隐藏, 删除,历史记录,撤销, 剪切, 图层,组合打散,锁定等功能
用vue写的 显示,隐藏 hide(){ this.canvas.getActiveObject().set('opacity', 0).setCoords(); this.canvas.reques ...
- js 实现复制粘贴文本过滤(保留文字和图片)
实现复制粘贴文本过滤(保留文字和图片) demo如下: <head> <meta http-equiv="Content-Type" content=" ...
- 通过如何通过js实现复制粘贴功能
在ie中window.clipboardData(剪切板对象)是可以被获取,所以利用这个方法我们可以实现在IE当中复制粘贴的功能,demo如下! <html> <head> & ...
- js实现选择及复制粘贴
最近项目有个点击复制到粘贴板的需求,在这里做一个简单的例子分享给大家,没考虑兼容性,需要兼容的大家去查找下文档 //html<p id="element">测试测试&l ...
- js 复制粘贴功能记录
最近工作中需要在前端页面中使用代码完成剪贴板的读写,网上搜索了下相应的资料,记录下... 这个功能有两个办法一个是js方式,一个是使用flash 一.JS方法 1.复制 首先复制的过程分为两步曲,无论 ...
- 让微信内置浏览器兼容clipboard.js 复制粘贴 ios 安卓
<!--js copy事件--><script type="text/javascript" src="/static/js/clipboard.min ...
- js实现复制粘贴功能
在项目中使用到复制粘贴功能,虽然网上有很多大牛封装了很多的插件,但是还是想不去使用插件,就像自己来实现这个功能. 另一篇是禁止复制粘贴 前端er怎样操作剪切复制以及禁止复制+破解等 初步想法: 1. ...
- 原生js复制粘贴上传图片前后台代码,兼容firebox,chrome, ie11,亲测有效
需求:粘贴上传图片,截图工具,右键粘贴,或者ctrl+v粘贴 方法1:可直接套用富文本框的图片上传功能,完成复制粘贴 缺点:麻烦,样式难控制 方法2:用原生js完成,以下案例基于此,样式请自己动手调整 ...
随机推荐
- JavaScript工具库 lodash 中文文档 英文文档
https://lodash.com/docs/ 英文版 http://lodashjs.com/docs/ 中文版 http://www.css88.com/doc/lodash/ 中文版 ...
- RocketMQ 单机安装
本章快速入门指南是在本地机器上设置 RocketMQ 消息传递系统以发送和接收消息的详细说明. 在这先对RocketMQ 做一个简单介绍. RocketMQ是一个纯java.分布式.队列模型的开源消息 ...
- 聊一聊 Django 中间件
Django默认的Middleware有七个: MIDDLEWARE = [ 'django.middleware.security.SecurityMiddleware', 'django.cont ...
- python全栈开发从入门到放弃之socket并发编程之IO模型
一 IO模型介绍 同步(synchronous) IO和异步(asynchronous) IO,阻塞(blocking) IO和非阻塞(non-blocking)IO分别是什么,到底有什么区别?这个问 ...
- Linux系统——Rsync数据同步工具
Rsync的优点及缺点 优点:类似cp命令.scp命令,但rsync为增量复制工具 缺点:针对大文件,效率非常高(打包再比对),针对小文件,效率非常低. Rsync作用 (1)可使本地和远程两台主机之 ...
- Codeforces Round #412 (rated, Div. 2, base on VK Cup 2017 Round 3) A Is it rated?
地址:http://codeforces.com/contest/807/problem/C 题目: C. Success Rate time limit per test 2 seconds mem ...
- linux系统上使用unzip命令
最近在本地使用maven打包工程后,将工程部署到linux服务器的tomcat上,使用unzip解压工程报--->未找到命令.即该命名文件未安装,需要安装一下.安装命令如下: yum insta ...
- Ubuntu安装samba实现文件夹共享
因工作需要,准备在Ubuntu服务器上共享文件夹,从Windows和Mac上都可以访问共享文件. 搜了一下,决定通过samba服务实现.安装过程如下: [step1]安装samba服务 sudo ap ...
- 前端虚拟接口mockjs的使用
最近在学习VueJS,也进一步学习了ES6,看了一遍之后,难免手痒,所以想仿写点什么,但是数据是个问题,你总不能写个分页,写个轮播吧,但是在公司做自己的东西找后台要接口也不那么像回事,怎么办呢? 无意 ...
- Oracle中用触发器实现自动记录表数据被修改的历史信息
oracle中用触发器实现自动记录表数据被修改的历史信息. 有一些比较重要的表字段每次修改需要做历史记录,以后可以查询这个表中某些字段如何被修改过.由什么改成了什么等,由谁操作,操作时间等. 实例:1 ...