（1）介绍： clipboard.js是一款轻量级的实现复制文本到剪贴板功能的JavaScript插件。通过该插件可以将输入框，文本域，DIV元素中的文本等文本内容复制到剪贴板中 clipboard.js支持主流的浏览器：chrome 42+; Firefox 41+; IE 9+; opera 29+; Safari 10+;
（2）clipboard复印内容的方式有 从target复印目标内容 通过function 要复印的内容 通过属性返回复印的内容 target复印目标内容，这里不说，就说一下function和属性的操作。
（3）Function操作有两种： 第一种： 通过target的function复印内容 通过target指定要复印的节点，这里返回舒值是‘hello’
Copy_target
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 第二种：
通过text的function复印内容 text的function指定的复印内容，这里返回‘to be or not to be’
Copy
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 第二种： 多节点
通过class获取所有button按钮，并做为参数传送给Clipboard。每个按钮被点击时，返回值的内容是其对应的data-clipboard-text的内容，分别是1，2，3
// 通过class注册多个button，获取data-clipboard-text的值 Copy Copy Copy
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 （5）函数和属性的兼容方式 函数：
//ClipboardJS.isSupported() //--------这句为：是否兼容 var clipboard = new Clipboard('.btn'); //优雅降级:safari 版本号>=10,提示复制成功;否则提示需在文字选中后，手动选择“拷贝”进行复制 clipboard.on('success', function(e) { alert('复制成功!') e.clearSelection(); }); clipboard.on('error', function(e) { alert('请选择“拷贝”进行复制!') //尝试去掉alert，能弹出系统的“拷贝”工具，但是需要点击两次按钮才能弹出，具体原因还不清楚，参考上图。有人说可以试一下在触发的地方写一个空点击事件, οnclick="" 因为ios不单纯支持on事件 }); 1 2 3 4 5 6 7 8 9 10 11 属性：
<img src="../../../../assets/images/zuop_award/copy_link.png" @click="copy" data-clipboard-action="copy" class="email" :data-clipboard-text="'mayouchen@csdn.com'" />
copy() { var clipboard = new Clipboard(".email") // console.log(clipboard); clipboard.on("success", e => { // console.log("复制成功", e); Toast({ message: "复制成功" }) // 释放内存 clipboard.destroy() }) clipboard.on("error", e => { // 不支持复制 Toast({ message: "手机权限不支持复制功能" }) console.log("该浏览器不支持自动复制") // 释放内存 clipboard.destroy() }) } <转载自blog.csdn.net/qq_24147051…
