<span id="codeNum">FTYHDSDW</span>
<span class=" code-btn" id="codeBtn" data-clipboard-target="#input">复制</span>

js代码

<script type="text/javascript">
function copyArticle(event) {
const range = document.createRange();
range.selectNode(document.getElementById('codeNum')); const selection = window.getSelection();
if(selection.rangeCount > 0) selection.removeAllRanges();
selection.addRange(range);
document.execCommand('copy');
alert("复制成功!");
}
document.getElementById('codeBtn').addEventListener('click', copyArticle, false); </script>

源地址:https://www.jianshu.com/p/6ec9c72dc5eb

JS复制文本到粘贴板,前端H5移动端点击按钮复制文本的更多相关文章

  1. JS实现PC、Android、IOS端的点击按钮复制内容功能

    直接上代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  2. 原生js实现复制文本到粘贴板

    项目中经常会遇到点击按钮复制订单号.订单id等内容到粘贴板中的需求.可是通常我们都是用Ctrl + c或右击复制的,别操心,js也是有复制命令的,那就是document.execCommand('co ...

  3. js实现复制内容到粘贴板

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  4. js 复制文字、 复制链接到粘贴板

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. js点击按钮复制内容到粘贴板

    复制内容到粘贴板,就是要选择需要复制的内容并执行document.execCommand("copy")命令: //复制内容到粘贴板 function copyToClipboar ...

  6. Ubuntu Vim 复制到系统粘贴板

    /************************************************************************* * Ubuntu Vim 复制到系统粘贴板 * 说 ...

  7. jquery点击按钮复制内容

    做移动端的项目遇到一个需求要点击按钮复制dom里的内容,看了很多资料显示必须textarea或者input里的内容才能简单复制,还有就是用插件的了,最终都因为遇到各种问题放弃,最终选择了最简单的点击复 ...

  8. jquery( 点击按钮出来文本框并限制文本框的个数)

    // 首先呢  编辑这个文章  主要是用于和大家的交流  以便学习和交流!! <div class="form-group" id="spots"> ...

  9. js 复制文本到粘贴板

    //html 在iOS Safari中,剪贴板API有一些限制(实际上是安全措施):   于安全原因,iOS Safari只允许容器中的document.execCommand('copy')文本co ...

随机推荐

  1. 微软 AI 公开课

    微软 AI 公开课 https://github.com/microsoft/ai-edu https://school.azure.cn/ https://docs.microsoft.com/le ...

  2. vue的filter用法,检索内容

    var app5 = new Vue({ el: '#app5', data: { shoppingList: [ "Milk", "Donuts", &quo ...

  3. Java 线程间通信 —— 等待 / 通知机制

    本文部分摘自<Java 并发编程的艺术> volatile 和 synchronize 关键字 每个处于运行状态的线程,如果仅仅是孤立地运行,那么它产生的作用很小,如果多个线程能够相互配合 ...

  4. springCloud中的服务调用feign

    springCloud中的服务调用(要在调用端写) 前提进行了服务注册 流程: 1.在服务模块中添加依赖 <!--服务调用--> <dependency> <groupI ...

  5. Dokcer中Mysql的数据导入导出

    导出 1.首先进入容器,输入提取数据库文件命令 mysqldump -u root -p rw 数据库名> 输出.sql,提取到当前容器 2.退出容器,进入linux:输入拷贝命令 docker ...

  6. Tawk.to工具使用攻略--如何让访客通过tawk.to联系时先填写邮箱、联系方式等信息

    Tawk.to工具使用攻略--如何让访客通过tawk.to联系时先填写邮箱.联系方式等信息 您在使用tawk.to的时候,是否遇到当访客联系您时,您未能及时查看到tawk.to的消息,后续想要再联系访 ...

  7. Python基础语法函数

    函数是什么 Python中的函数与数学中的函数不同,它不再只是公式,而是实实在在有着自己特定功能的代码.其实在潜移默化中我们已经有所接触了. 比如print()函数,range()函数,type()函 ...

  8. nacos配置中心之服务器端

    配置信息的发布 配置信息发布请求URL: POST: /v1/cs/configs nacos在STANDALONE模式或集群模式没有指定用mysql情况下使用derby数据库,在集群模式且指定mys ...

  9. 后端程序员之路 38、Scala入门

    Scala 是 Scalable Language 的简写,是一门多范式的编程语言. 语言特性:1.面向对象,所有值都是对象,类可以继承和组合:2.函数式,支持闭包,支持柯里化等等:3.静态类型,支持 ...

  10. C#正则实现匹配一块代码段

    最近项目,生成聚合网关,但是生成的网关文件中,存在着不必要的代码段,比如一个类A,类B等 之前一直使用手动删除,这么做劳民伤财,浪费时间,考虑使用正则写一个工具实现自动删除. 正则写法: string ...