說到j(luò)s復(fù)制插件，大部分人用的應(yīng)該是ZeroClipboard了，但是ZeroClipboard插件有一個弊端，就是必須要用到一個flash文件，這無論是在插件的加載效率還是使用體驗上，都是不夠完美的。那么有沒有一個不用flash文件的js復(fù)制插件呢？答案是有的，那就是本文要介紹的clipboard.js。
實例代碼
target-input.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>target-input</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<input id="foo" type="text" value="hello">
<button class="btn" data-clipboard-action="copy" data-clipboard-target="#foo">Copy</button>
<script src="../dist/clipboard.min.js"></script>
<script>
var clipboard = new Clipboard('.btn');
</script>
</body>
</html>
代碼解釋及使用方法：
先下載clipboard.js文件，放到網(wǎng)站某一個目錄下。點擊下載。
使用時html代碼要先引用clipboard.js文件，注意路徑要寫對，引用寫法是：
<script src="../dist/clipboard.min.js"></script>
在后面要實例化Clipboard，寫法是：
<script>
var clipboard = new Clipboard('.btn');
</script>
復(fù)制input輸入框里的文字的寫法：
<input id="foo" type="text" value="hello">
<button class="btn" data-clipboard-action="copy" data-clipboard-target="#foo">Copy</button>
這里有三個地方要寫對：
1）input的id要與button的data-clipboard-target的值一致，這個例子是foo。
2）button的class的值要與后面實例化Clipboard的寫法new Clipboard('');一致，這個例子是btn。
3）button的data-clipboard-action的值是copy。
clipboard.js豐富強(qiáng)大的復(fù)制功能
clipboard.js具有豐富強(qiáng)大的復(fù)制功能，除了上面介紹的復(fù)制input輸入框里的文字之外，還可復(fù)制textarea里的文字，可復(fù)制某一個div里的文字。此外，還可以通過event事件返回任何文本復(fù)制到剪貼板里，也可以通過event事件復(fù)制任何標(biāo)簽（比如div）里的文字。
所有這些復(fù)制功能都能在本文的演示頁面里找到。
