第一步:链接 Clipboard 的js文件

< script  src = “ https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js ” > </ script >
或者 < script  src = “ https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js ” > </ script >
或者 < script  src = “ https://rawcdn.githack.com/zenorocha/clipboard.js/v2.0.0/dist/clipboard.min.js ” > </ script >
或者 < script  src = “ https://unpkg.com/clipboard@2/dist/clipboard.min.js ” > </ script >
或者 https://clipboardjs.com/ 直接下载文件

第二步:html代码

<span id="clipboard">被复制的内容</span>

<button data-clipboard-target="#clipboard" id="fuzhi">

第三步:写入以下js代码

// “类名、id”

var clipboard2 = new ClipboardJS("fuzhi", {

// 修改 text 的内容
text: function() {

// 返回 text 的内容

return document.getElementById("clipboard").innerText;
}
});

Clipboard---将文本复制到剪切板上的更多相关文章

  1. js-将文本复制到剪切板

    // 将文本复制到剪切板 var clipboard2 = new ClipboardJS('.add_wx_guide_float', { text: function(trigger) { ret ...

  2. iOS-开发将文本复制到剪切板

    下面方法可以将文本复制到剪切板 UIPasteboard *pboard = [UIPasteboard generalPasteboard]; pboard.string = @"邀请码& ...

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

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

  4. android实现文本复制到剪切板功能(ClipboardManager)

    Android也有剪切板(ClipboardManager),可以复制一些有用的文本到剪贴板,以便用户可以粘贴的地方使用,下面是使用方法   注意:导包的时候 API 11之前: android.te ...

  5. ZeroClipboard.js兼容各种浏览器复制到剪切板上

    http://www.cnblogs.com/huijieoo/articles/5569990.html <script type="text/javascript" sr ...

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

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

  7. Flash10下复制到剪切板的一种新方法

    web开发中常常要实现“复制到剪切板”功能.这个功能很实用,但是由于安全问题,浏览器的限制越来越严,实现的方法也越来越有限了.Firefox默认下不能直接通过Javascript操作剪切板,必须开启相 ...

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

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

  9. vim复制到剪切板

    作者:whinc链接:https://www.zhihu.com/question/19863631/answer/89354508来源:知乎 转载文章 Vim 中的复制.删除的内容都会被存放到默认( ...

随机推荐

  1. CSS中各种居中的问题

    1.元素水平居中 1.1 在父元素上使用text-align: center; father { text-align: center; } 1.2 margin: 0 auto; 在上一个问题中,我 ...

  2. 【WebSocket】WebSocket介绍

    1.背景 在WebSocket出现之前客户端向服务器发出请求是通过http协议实现的,而http协议有个特点是通行请求只能由客户端发起,然后服务端响应查询结果,HTTP 协议没法让服务器主动向客户端推 ...

  3. Sublime Text 3 安装简记

    1.下载:( Sublime Text Version 3.1.1 Build 3176 ) https://www.sublimetext.com/3 2.安装Package Control: &q ...

  4. Sublime Text3—自带快捷键介绍

    摘要: Sublime Text是个小巧便捷的编辑器,除了众多好用的插件外,还有它自带的快捷键,打代码事半功倍,不会用的赶紧看看吧! 其实菜单上都有,看不懂可以汉化,Key Bindings-Defa ...

  5. 那些年我们一起追逐的多线程(Thread、ThreadPool、委托异步调用、Task/TaskFactory、Parallerl、async和await)

    一. 背景 在刚接触开发的头几年里,说实话,根本不考虑多线程的这个问题,貌似那时候脑子里也有没有多线程的这个概念,所有的业务都是一个线程来处理,不考虑性能问题,当然也没有考虑多线程操作一条记录存在的并 ...

  6. Spring cloud gateway

    ==================================为什么需要API gateway?==================================企业后台微服务互联互通, 因为 ...

  7. Java(18) 集合框架

    一.集合框架 Collectoin                   Map List           set              HashMap ArrayList LinkedList ...

  8. 使用Hexo+github搭建个人博客

    目录 创建Github仓库 环境安装 安装Node.js 安装Git 检查安装 安装Hexo 连接Hexo和Github 设置Git的用户名和邮箱 配置SSH 配置Deployment 新建第一篇博客 ...

  9. idea工具的快捷方式

    用idea默认的快捷键 Ctrl+~,快速切换方案(界面外观.代码风格.快捷键映射等菜单) Shift+Enter,向下插入新行 Ctrl+F,查找文本 Ctrl+R,替换文本 Ctrl+I,实现方法 ...

  10. C# - 设计模式 - 虚模式

    虚模式 问题场景 子类从抽象派生是为了解耦,但为了适应新的变化,可能需要向抽象类添加新功能,假如在添加新功能之前已经有100个子类实现了抽象,那么接下来你得在100个子类中去重写向抽象添加的新功能. ...