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完成,以下案例基于此,样式请自己动手调整 ...
随机推荐
- oracle的相关信息
[INS-08109] :https://blog.csdn.net/u012830807/article/details/17302919[INS-13001]:https://blog.csdn. ...
- 细说PHP7
PHP7带来的新东西 1.类型的声明. 可以使用字符串(string), 整数 (int), 浮点数 (float), 以及布尔值 (bool),来声明函数的参数类型与函数返回值. declare(s ...
- vue 动画过渡
一.过渡(动画) 1. 简介 Vue 在插入.更新或者移除 DOM 时,提供多种不同方式的应用过渡效果,本质上还是使用CSS3动画:transition.animation 2. 基本用法 1.使用t ...
- 4-es6的模块化编程
诞生背景其他都是第三方库,只有es才是官方正宗的,如果es早就制定的话,也不至于现在的这么百花齐放(混乱)的局面了 核心规范一个文件就是一个模块export是暴露出模块的公开方法import是导入 实 ...
- HDU - 4675 GCD of Sequence (莫比乌斯反演+组合数学)
题意:给出序列[a1..aN],整数M和k,求对1-M中的每个整数d,构建新的序列[b1...bN],使其满足: 1. \(1 \le bi \le M\) 2. \(gcd(b 1, b 2, -, ...
- asp.net时间显示
DateTime dt = DateTime.Now;// Label1.Text = dt.ToString();//2005-11-5 13:21:25// Label2.Text = ...
- eclipse调整字体大小
window->preferences->general->appearance->colors and fonts-> 双击Text Font 就调整字体大小了
- 【转】html之file标签 --- 图片上传前预览 -- FileReader
记得以前做网站时,曾经需要实现一个图片上传到服务器前,先预览的功能.当时用html的<input type="file"/>标签一直实现不了,最后舍弃了这个标签,使用了 ...
- JMS--消息头
一个消息对象分为三部分:消息头(Headers),属性(Properties)和消息体(Payload).对于StreamMessage和MapMessage,消息本身就有特定的结构,而对于TextM ...
- $Python技巧大全
知乎上有一个问题:Python 有什么奇技淫巧?其中有各种不按套路出牌的招数,也不乏一些惊为天人的"奇技淫巧",会让你大呼:居然还有这种操作??? 本文就是对日常使用过的或者觉得很 ...