<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. Vue 3.x Composition API

    Vue 3.x Composition API setup 调用时机 创建组件实例,然后初始化 props ,紧接着就调用setup 函数; 从生命周期钩子的视角来看,它会在 beforeCreate ...

  2. shit mint-ui & navbar click event bug

    shit mint-ui & navbar click event bug # Vue 2.0 npm install mint-ui -S // 引入全部组件 import Vue from ...

  3. Open API collection

    Open API collection online API https://developer.github.com/v3/ https://developer.github.com/v4 http ...

  4. 「NGK每日快讯」2021.1.25日NGK公链第83期官方快讯!

  5. HTTP 协议的前世今生

    尽人事,听天命.博主东南大学研究生在读,热爱健身和篮球,正在为两年后的秋招准备中,乐于分享技术相关的所见所得,关注公众号 @ 飞天小牛肉,第一时间获取文章更新,成长的路上我们一起进步 本文已收录于 C ...

  6. C#关于panle重叠

    当多个panle重叠不显示不出来的时候  选择视图---------------其它窗口----------------文档大纲  然后拖动进行调整

  7. 微信小程序(三)-事件绑定

    小程序事件绑定 https://developers.weixin.qq.com/miniprogram/dev/framework/view/two-way-bindings.html 1.数据 / ...

  8. C#日志使用

    本文参考链接 日志框架 框架选择:NLog 安装方法,Nuget命令行:Install-Package NLog 常用规则 尽量不要在循环中打印日志. 应输出错误的堆栈信息:e.Message仅为异常 ...

  9. NodeJs 入门到放弃 — 常用模块及网络爬虫(二)

    码文不易啊,转载请带上本文链接呀,感谢感谢 https://www.cnblogs.com/echoyya/p/14473101.html 目录 码文不易啊,转载请带上本文链接呀,感谢感谢 https ...

  10. Prometheus + Spring Boot 应用监控

    1.  Prometheus是什么 Prometheus是一个具有活跃生态系统的开源系统监控和告警工具包.一言以蔽之,它是一套开源监控解决方案. Prometheus主要特性: 多维数据模型,其中包含 ...