【Html】Clipboard.js 实现点击复制,剪切板操作
<script type="text/javascript" src="./dist/clipboard.min.js"></script>
html
<input type="text" id="copyVal" readonly value="被复制内容" />
<button class="copyBtn" >点击复制</button>
javascript
//实例化 ClipboardJS对象;
var copyBtn = new ClipboardJS('.copyBtn'); copyBtn.on("success",function(e){
// 复制成功
alert(e.text);
e.clearSelection();
});
copyBtn.on("error",function(e){
//复制失败;
console.log( e.action )
});
这里的ClipboardJS在实例化时, 如果报错:clipboard is not defined
解决办法就是如下:
new ClipboardJS(obj)
原因就是 Clipboard.JS版本是2.0及以上版本
原文地址:https://blog.csdn.net/fly_wugui/article/details/80327385
【Html】Clipboard.js 实现点击复制,剪切板操作的更多相关文章
- Clipboard.js – 现代方式实现复制文本到剪贴板
复制文本到剪贴板应该并不难,目前已经有很成熟的 Flash 方法.但是 Flash 已经在很多场合不适用了,特别是随着 HTML5 技术的发展.今天推荐的这个 Clipboard.js 库不依赖 Fl ...
- js 实现点击复制文本内容
js 实现点击复制文本内容 <table> <tr><td>姓名:<span onclick="copyContent(this);" ...
- js实现点击复制网页内容(基于clipboard.js)
浏览网页过程中会遇到点击复制链接地址的情况,下面就介绍一种实现方法,该方法是基于clipboard.js: 官网地址:https://clipboardjs.com/: clipboard.js使用比 ...
- clipboard.js 实现web端---> 复制到剪切板功能
package.json 中: 添加clipboard 依赖 "dependencies": { "vue": "^2.2.2", &quo ...
- 解决clipboard.js在移动端复制失败的问题
1.前沿 在项目中使用clipboard.js插件去实现点击按钮,复制一段网址到剪切板的功能.功能做好后,一开始无论这pc端还是移动端都能正常使用.突然某一天测出了一个bug:移动端复制失败,pc端是 ...
- clipboard.js实现页面内容复制到剪贴板
clipboard.js实现复制内容到剪切板,它不依靠flash以及其他框架,应用起来比较简单 <input type="text" name="copy_txt& ...
- PyQt5剪切板操作
1.使用剪切板import sys,mathfrom PyQt5.QtWidgets import *from PyQt5.QtGui import *from PyQt5.QtCore import ...
- cliipblard.js 实现点击复制
<script src="js/clipboard.min.js"></script> <script type="text/javascr ...
- js实现点击复制网页内容(基于execCommand)
通过execCommand方法来实现,当一个HTML文档切换到设计模式 designMode时,文档对象暴露 execCommand 方法,该方法允许运行命令来操纵可编辑区域的内容.大多数命令影响文档 ...
随机推荐
- 微信公众号与APP微信第三方登录账号打通
一个项目同时开发了APP和微信服务号,需要做到APP和微信服务号的账号互通同步,也就是说一个账号在2个地方都可以用,当然这个前提是保证你公司自己的服务器的数据库用的是同一套. 为保证用户数据的唯一性, ...
- java集群优化——ORM框架查询优化原理
众所周知,当下的流行的企业级架构中,ORM一直是最基础的部分,在架构设计的底层.对逻辑层提供面向对象的操作支持,而事实总是和我们预想的有所偏差,ORM在提供了较好的操作体验时,也流失了一部分原生SQL ...
- 行为类模式(六):备忘录(Memento)
定义 在不破坏封闭的前提下,捕获一个对象的内部状态,并在该对象之外保存这个状态.这样以后就可将该对象恢复到原先保存的状态. UML 优点 将被存储的状态放在外面,不要和关键对象混在一起,可以帮助维护内 ...
- How to install Hadoop Cluster
https://dwbi.org/etl/bigdata/183-setup-hadoop-cluster https://www.linode.com/docs/databases/hadoop/h ...
- mysql_secure_installation
安装完mysql-server 会提示可以运行mysql_secure_installation.运行mysql_secure_installation会执行几个设置: a)为root用户设置密码 ...
- 使用canvas绘制扇形图
<!doctype html><html lang="en"><head> <meta charset="UTF-8" ...
- SAP BI vs. Oracle BI
对比Oracle BI产品和SAP BI 产品,做一些简单的产品功能比较,经供参考. 这里把SAP和Oracle同类的产品放在一行,用于比较. SAP BI 特点 Oracle BI 特点 BW 和S ...
- 使用jQuery清空file文件域的解决方案
使用jQuery清空file文件域的解决方案 var file = $("#file") file.after(file.clone().val("")); f ...
- IntelliJ IDEA maven库下载依赖包速度慢的问题
Reference: https://blog.csdn.net/qq1501340219/article/details/54638158 在pom.xml中添加maven 依赖包时,我就发现不管是 ...
- pandas 常用函数整理
pandas常用函数整理,作为个人笔记. 仅标记函数大概用途做索引用,具体使用方式请参照pandas官方技术文档. 约定 from pandas import Series, DataFrame im ...