copy =() => {
const dom = document.getElementById(`collect-text-${t.Id}`)
const selection = window.getSelection()
const range = document.createRange() if (!dom || !selection || !range) return // 选择复制目标
range.selectNodeContents(dom)
selection.removeAllRanges()
selection.addRange(range) // 已复制文字
console.log('selectedText', selection.toString()) // 执行复制
document.execCommand('copy') // 去除所有选中
selection.removeAllRanges()
// 复制内容成功,通过ctrl+v粘贴使用!
}

参考资料:

select :  https://github.com/zenorocha/select

clipboard.js :  https://github.com/zenorocha/clipboard.js

H5/纯JS实现:把网页中的文字复制到剪切板的更多相关文章

  1. js 最简单的实现复制到剪切板 xl_copy

    使用 npm install xl_copy // 项目中安装 import clipboard form 'xl_copy' // 引用 element.onclick = ()=>{     ...

  2. 复制到剪切板js代码(转)

    <script type="text/javascript" language="javascript"> //复制到剪切板js代码 functio ...

  3. clipboard.js 实现动态获取内容并复制到剪切板

    使用clipboard.js分为以下几个步骤: 1.引入一个clipboard.js的文件: 2.新建一个clipboard对象: 3.点击按钮获取目标对象里面的内容,将其复制到剪切板. 注意:1.目 ...

  4. web复制到剪切板js

    web复制到剪切板 clipboard.js 好使!开源项目,下载地址: https://github.com/zenorocha/clipboard.js 使用方法: 引入 clipboard.mi ...

  5. 在纯HTML的静态网页中添加一段统计网页访问量的JAVA Script代码?

    如何在网站上进行流量统计呢,可以找第三方服务网站去注册,但也可以在网站上直接添加代码,只需将以下代码copy到你的网页中,复制到</body>之前就可以啦!是不是很简单啊! <scr ...

  6. javaScript 实现倒计时 + 获取网页中的文字

    一.倒计时 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <tit ...

  7. clipboard.js 实现web端---> 复制到剪切板功能

    package.json 中: 添加clipboard 依赖 "dependencies": { "vue": "^2.2.2", &quo ...

  8. js 将内容复制到剪切板上

    clipboard是将内容复制到电脑的剪切板上,要引入clipboard.js //将'data-clipboard-text' 样式添加到指定的元素上 $("#effects") ...

  9. js中实现 复制到剪切板 功能

    一:引包 <script type="text/javascript" src="jquery.js"></script> <sc ...

随机推荐

  1. MySQL InnoDB 索引 (INDEX) 页结构

    MySQL InnoDB 索引 (INDEX) 页结构 InnoDB 为了不同的目的而设计了不同类型的页,我们把用于存放记录的页叫做索引页 索引页内容 索引页分为以下部分: File Header:表 ...

  2. redhat7.7(centOS7)安装ORACLE 11g出坑教程及问题总结与解决

    写在前面: 环境建议:VM 15.5,因为15.5修复了诸多bug,可以在安装过程中省去不少麻烦 添加新的虚拟机安装redhat7.7 准备redhat7.7的安装包...百度云不让上传噢噢噢噢,这里 ...

  3. STL pair类型的介绍

    pair标准库类型它定义在头文件utility中. 一个pair保存两个数据成员.类似容器,pair是一个用来生成特定类型的模板.当创建一个pair时,我们必须提供两个类型名,pair的数据成员将具有 ...

  4. Python程序中的进程操作-进程间数据共享(multiprocess.Manager)

    目录 一.进程之间的数据共享 1.1 Manager模块介绍 1.2 Manager例子 一.进程之间的数据共享 展望未来,基于消息传递的并发编程是大势所趋 即便是使用线程,推荐做法也是将程序设计为大 ...

  5. Python连载48-正则表达式(中)

    一.正则的写法: . (点好) :表示任意一个字符,除了\n,比如查找所有的一个字符\. [] :匹配中括号中列举的任意字符,比如[L,Y,0], LLY, Y0, LIU \d :任意一个数字 \D ...

  6. Python连载45-XML解析(使用minidom和etree分别示例)

    一.我们对XML的读取进行一波演示 import xml.dom.minidom #负责解析xml文件的包 from xml.dom.minidom import parse ​ #使用minidom ...

  7. 基于Node 的http转发demo,项目中请使用express+http-proxy-middleware

    var http = require("http"); var data = ''; function getData() { const options = { host: 'w ...

  8. 易飞ERP API接口调用DEMO

    一.使用场景: 1.需要开放ERP数据给第三方系统对接,如APP手机端开发,MES,OA等: 2.接口按现在主流开发,restful风格,传JSON数据,跨平台,不限开发工具: 3.不限易飞ERP,支 ...

  9. WPF 使用XML作为绑定源时Xaml注意事项

    直接在xaml定义时xml时应该注意的! xml数据 <?xml version="1.0" encoding="utf-8"?> <Stri ...

  10. 动态SQL屏幕条件选择(里面还有赋值的新语法)

    有时候屏幕条件中使用PARAMETERS时候,如果你为空的话,会查不出数据,但是可能你的想法是不想限制而已,但是系统默认理解为了空值,这个时候,如果取判断一下条件是不是空,在SQL里决定写不写的话,会 ...