页面复制按钮的文档

在页面内添加复制按钮至剪切板

一个简单好用的工具clipboard.js

我的使用场景

本文只截取了自己使用过程中的一个小demo,详细的使用方法请移步clipboard.js下载使用官方说明案例

引用js，下载clipboard.js,引用至文档

<script src="../dist/clipboard.min.js"></script>
//或使用CDN
<script src="https://cdn.rawgit.com/zenorocha/clipboard.js/master/dist/clipboard.min.js"></script>

我最喜欢的添加方式，html结构简要如下

<button class="btn">Copy</button>
<div>hello</div>

js代码，创建对象后设置监听对象，return后就是你选中的要监听的节点，本人使用的时候发现这个思路比较简单（其实其他方式也简单）

<script>
    var clipboard = new Clipboard('.btn', {
        target: function() {
            return document.querySelector('div');
        }
    });

    clipboard.on('success', function(e) {
        console.log(e);
    });

    clipboard.on('error', function(e) {
        console.log(e);
    });

有兴趣的朋友可以自己测试下，愿世界和平。