《用clipboard.js實現(xiàn)純JS復制文本,比ZeroClipboard.js好用》要點:
本文介紹了用clipboard.js實現(xiàn)純JS復制文本,比ZeroClipboard.js好用,希望對您有用。如果有疑問,可以聯(lián)系我們。
相關(guān)主題:JS、Jquery插件
以前很多人都是用ZeroClipboard.js來實現(xiàn)網(wǎng)頁復制內(nèi)容,火端也是用它。ZeroClipboard是利用flash來實現(xiàn)的,ZeroClipboard兼容性很好,但是由于現(xiàn)在越來越多的瀏覽器不支持flash,導致一些沒法正常使用了。
今天火端開始使用clipboard.js來復制網(wǎng)頁文本內(nèi)容了,clipboard.js不需要flash,也不依賴其它的js庫,min版僅11KB,GZIP壓縮后僅3KB,非常的小巧。
使用起來也非常的簡單,代碼如下:
<input id="foo" value="這里是內(nèi)容">
<button class="btn" data-clipboard-target="#foo">點擊復制</button>
<script src="dist/clipboard.min.js"></script>
<script>
new Clipboard('.btn');
<script>
如果要添加事件,可以這樣:
<input id="foo" value="這里是內(nèi)容">
<button class="btn" data-clipboard-target="#foo">點擊復制</button>
<script src="dist/clipboard.min.js"></script>
<script>
var clipboard = new Clipboard('.btn');
clipboard.on('success', function(e) {
alert("復制成功!");
e.clearSelection();
});
clipboard.on('error', function(e) {
alert("復制失敗!");
});
<script>
支持的瀏覽器如下:
還有更多例子以及下載請看官網(wǎng):https://clipboardjs.com/
或者直接下載:https://github.com/zenorocha/clipboard.js/archive/master.zip
轉(zhuǎn)載請注明本頁網(wǎng)址:
http://www.fzlkiss.com/jiaocheng/14661.html