<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. 时间轴 timeline

    时间轴 timeline https://www.helloweba.net/javascript/285.html https://www.helloweba.net/demo/v_timeline ...

  2. svg click event bug & css pointer-events

    svg click event bug & css pointer-events svg click event not working Error OK ??? css class /* d ...

  3. uniapp 在h5和小程序上使用高德获取用户城市位置

    开发文档 https://lbs.amap.com/api 错误状态 https://lbs.amap.com/api/webservice/guide/tools/info/ 虽然用的高德但是你还需 ...

  4. react UI 框架对比

    传送门  https://blog.csdn.net/qiqingjin/article/details/79219206 点击

  5. NGK算力持有好处多多!SPC、VAST等免费拿!

    众所周知,NGK是分布式存储的,作为Web3.0以及数字经济时代的基础设施,为数字加密市场带来了全新的商业模式和经济业态,但是,这只是一个重要的起点,真正的价值还在后面! 为了满足NGK生态建设者强烈 ...

  6. [JAVA学习笔记]JAVA基本程序设计结构

    一个简单的Java应用程序 public class FirstSample { public static void main(String[] args) { System.out.println ...

  7. Yarn框架的一般过程

    基本过程图: Clinet向ResouceManager发送Job请求 ResouceManager接受到请求后在自身开启一个Container 来运行的ApplicationManager组件,Ap ...

  8. Maven 打包项目到私服 (deploy)

    一.配置maven 在maven安装目录 /conf/setting.xml 中的servers下添加: 1 <servers> 2 <server> 3 <id> ...

  9. Hive实现自增序列及常见的Hive元数据问题处理

    Hive实现自增序列 在利用数据仓库进行数据处理时,通常有这样一个业务场景,为一个Hive表新增一列自增字段(比如事实表和维度表之间的"代理主键").虽然Hive不像RDBMS如m ...

  10. C# ref and out

    相同点: 1. ref 和 out 都是按地址传递的,使用后都将改变原来参数的数值: 2. 方法定义和调用方法都必须显式使用 ref 或者 out关键字: 3. 通过ref 和 ref 特性,一定程度 ...