【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 方法,该方法允许运行命令来操纵可编辑区域的内容.大多数命令影响文档 ...
随机推荐
- hdu 1879 继续通畅工程(最小生成树)
题目:http://acm.hdu.edu.cn/showproblem.php?pid=1879 /************************************************* ...
- 探寻main函数的“标准”写法,以及获取main函数的参数、返回值
main函数表示法 很多同学在初学C或者C++时,都见过各种各样的main函数表示法: main(){/*...*/} void main(){/*...*/} int main(){/ ...
- React 设计思想
https://github.com/react-guide/react-basic React 设计思想 译者序:本文是 React 核心开发者.有 React API 终结者之称的 Sebasti ...
- Nginx 权限问题
At my job we are moving to Nginx for the load balancing of our sites. Nginx is a very powerful load ...
- .NET MVC下的日志文件生成法
/// <summary> /// 写日志文件 /// </summary> /// <param name="Infos">日志内容</ ...
- Linux之Kill进程的N种方法
常规篇: 首先,用ps查看进程,方法如下: $ ps -ef …… smx 1822 1 0 11:38 ? 00:00:49 gnome-terminal smx ...
- Frick'ing Terrain Mesh!
CDLOD地形的实现方法步骤: 1.实现完全二叉树结构的创建2.实现完全四叉树的视锥裁剪与LOD选择(包括节点的部分选择功能)3.使用forward rendering, 实现已选择四叉树节点的普通渲 ...
- Secure gRPC with TLS/SSL
摘自:http://bbengfort.github.io/programmer/2017/03/03/secure-grpc.html Secure gRPC with TLS/SSL 03 Mar ...
- ImportError: cannot import name 'main'的解决办法
一.现象 使用pip出现如下提示: Traceback (most recent call last): File "/usr/bin/pip3", line 9, in < ...
- MySQL load数据的时候自动更新时间
MySQL load数据的时候自动更新时间 前提 CREATE TABLE table_name ( dt varchar(255) NULL , ctime timestamp NULL ON UP ...