<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. rem & 16px & 62.5%

    rem & 16px & 62.5% 浏览器的默认字体大小都是16px 兼容性:IE9+,Firefox.Chrome.Safari.Opera 的主流版本都支持了rem 对不支持的浏 ...

  2. taro 小程序 & touch event 转换 bug

    taro 小程序 & touch event 转换 bug before after 事件处理 https://nervjs.github.io/taro/docs/event.html#do ...

  3. GoEasy使用阿里云OSS出现的问题

    前言:本人使用goeasy来实现微信小程序里面和其他人的im临时对话窗口,想要实现可以同时发送语音和视频.图片.表情包的话,就要通过goeasy关联到阿里云的存储对象. 报错:The OSS Acce ...

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

  5. VAST上线后,如何提升NGK算力生态的收益和流动性?

    自比特币诞生以来,"挖矿"一词就成功地步入了大众的视野,也成为了加密货币领域最重要的组成部分之一.无论是早前基于比特币和以太坊为主的算力挖矿,还是逐步进入大众视野的质押挖矿,亦或是 ...

  6. NGK公链:夯实基础设施 实现产业大规模应用

    当前,区块链已经成为全球技术角逐的前沿,大国及科技巨头竞相在该领域布局,引导区块链服务实体经济,激发市场经济活力.据市场相关研究机构预测,2020年,基于区块链的业务将达到1000亿美元. 对于区块链 ...

  7. Mac上的Redis安装和使用

    redis简介 REmote DIctionary Server(Redis) 是一个由 Salvatore Sanfilippo 写的 key-value 存储系统,是跨平台的非关系型数据库. Re ...

  8. WPF 解决内置谷歌浏览器(Cef.ChromiumWebBrowser)在触摸屏无法进行滚动的问题

    1.问题描述: 最近在WPF的项目中,需要在控件中嵌套可以浏览特定网页的内容,所以使用了 Cef.ChromiumWebBrowser来解决问题.在执行项目的过程中,主要碰到的问题有: 1.1 当把项 ...

  9. 后端程序员之路 36、Apache Kafka

    Apache Kafkahttp://kafka.apache.org/ Kafka,很容易就联想到<海边的卡夫卡>,文艺程度和Casablanca有得一拼.Kafka是一个分布式消息系统 ...

  10. QuickBase64 - Android 下拉通知栏快捷base64加解密工具

    Android Quick Setting Tile Base64 Encode/Decode Tool Android 下拉通知栏快捷 base64 加解密,自动将剪切板的内容进行 base64 E ...