clipboard JS(剪切板)的使用
- 引入js(根据路径需要修改url)
<script src="lib/clipboard/clipboard.min.js" type="text/javascript"></script>
2.代码
html:
<a class="my-btn btn btn-block btn-default my-copy" ng-click="copy()">复制</a>
js:
function copy(text) {
var clipboard = new Clipboard('.my-copy', {
text: function () {
return text;
}
});
clipboard.on('success', function (e) {
console.log(e.text)
clipboard.destroy()
});
}
// 与DOM绑定的方法
$scope.copy = function () {
copy('nihao');
}
3.代码说明
text:function 的作用为:绑定dom、成功执行回调函数
clipboard JS(剪切板)的使用的更多相关文章
- js 剪切板应用clipboardData
http://blog.csdn.net/fox123871/article/details/6454634 <a href="http://blog.csdn.net/fox1238 ...
- [.NET开发] C#实现剪切板功能
C#剪切板 Clipboard类 我们现在先来看一下官方文档的介绍 位于:System.Windows.Forms 命名空间下 Provides methods to place data on an ...
- 使用clipboard.js复制页面内容到剪切板
最近在做一个的智能客服Web端浏览器应用,其中有一项需求是客户在获取系统返回的 答案后点击“复制答案”按钮将答案复制到系统剪切板.本以为这是一个小case,但是发现如果 要对各种主流浏览器都有良好的兼 ...
- clipboard.js 实现web端---> 复制到剪切板功能
package.json 中: 添加clipboard 依赖 "dependencies": { "vue": "^2.2.2", &quo ...
- clipboard.js 实现动态获取内容并复制到剪切板
使用clipboard.js分为以下几个步骤: 1.引入一个clipboard.js的文件: 2.新建一个clipboard对象: 3.点击按钮获取目标对象里面的内容,将其复制到剪切板. 注意:1.目 ...
- vue中使用剪切板插件 clipboard.js
vue中使用剪切板需要借助一个插件,clipboard,使用方法还是很简单的,先下载,然后引入: npm i clipboard -S //引入 import Clipboard from 'clip ...
- Clipboard.js实现复制内容到剪切板
<script type="text/javascript"> var clipboard1 = new Clipboard('.bt01'); clipboard1. ...
- 用clipboard.js实现纯JS复制文本到剪切板
以前很多人都是用ZeroClipboard.js来实现网页复制内容,火端也是用它.ZeroClipboard是利用flash来实现的,ZeroClipboard兼容性很好,但是由于现在越来越多的浏览器 ...
- jquery复制值到剪切板(clipboard.js)
引入一个clipboard.js文件即可使用,下载地址:https://github.com/zenorocha/clipboard.js <script type="text/jav ...
随机推荐
- JavaScript跳转和打开新窗口
跳转: window.location.href = "www.baidu.com" // 跳转到百度首页,不打开新的浏览器窗口 等价于html中的<a href=&quo ...
- 问题:C# Dictionary嵌套使用;结果:嵌套Dictionary添加 , C#2.0泛型详细介绍
Dictionary<int, Dictionary<string, string>> dict1 = new Dictionary<int, Dictionary< ...
- C++中对象的常引用
直接传递对象名 用对象名做函数参数时,在函数调用时将建立一个新的对象,它是形参对象的拷贝. ================下面给出一个直接传递对象名的例子程序1.1================= ...
- JS中双击和单击事件冲突解决
在JS中代码中同一功能块中通常同时会用到单击.双击事件,但通常会遇到一个问题,就是在双击的时候即执行了一次双击事件,而且还执行了两次单击事件.此类冲突在ZTree.DHTMLX中经常遇到. 想要解决两 ...
- 31.TCP/IP 三次握手与四次挥手
TCP/IP三次握手 TCP建立连接为什么是三次握手,而不是两次或四次? TCP,名为传输控制协议,是一种可靠的传输层协议,IP协议号为6. 顺便说一句,原则上任何数据传输都无法确保绝对可靠,三次握手 ...
- 【OpenGL】Shader概述
目录(?)[-] 综述 编译一个Shader 链接一个Shader 删除一个Shader 指定使用一个Shader Program 删除一个Shader Program 备注 这篇文章讲述了Shade ...
- TMF大数据分析指南 Unleashing Business Value in Big Data(一)
大数据分析指南 TMF Frameworx最佳实践 Unleashing Business Value in Big Data 前言 此文节选自TMF Big Data Analytics Guide ...
- Dapper 增删改查
0.数据库及实体类 create table Users ( Id ,) primary key, Name nvarchar() not null, Password nvarchar() not ...
- Ubuntu16.04启动xtion pro live报错
william@william-System-Product-Name:~$ roslaunch openni2_launch openni2.launch ... logging to /home/ ...
- vue -- 异常处理集合
1.npm run dev 运行出错,报错如下: > webpack-dev-server --inline --progress --config build/webpack.dev.conf ...