日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當(dāng)前位置: 首頁 > 前端技术 > javascript >内容正文

javascript

用clipboard.js实现纯JS复制文本到剪切板

發(fā)布時間:2023/11/29 javascript 45 豆豆
生活随笔 收集整理的這篇文章主要介紹了 用clipboard.js实现纯JS复制文本到剪切板 小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.

? ? ? 以前很多人都是用ZeroClipboard.js來實(shí)現(xiàn)網(wǎng)頁復(fù)制內(nèi)容,火端也是用它。ZeroClipboard是利用flash來實(shí)現(xiàn)的,ZeroClipboard兼容性很好,但是由于現(xiàn)在越來越多的瀏覽器不支持flash,導(dǎo)致一些沒法正常使用了。

? ? ??今天火端開始使用clipboard.js來復(fù)制網(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">點(diǎn)擊復(fù)制</button> <script src="dist/clipboard.min.js"></script> <script>new Clipboard('.btn');//首先需要您需要通過傳遞DOM選擇器,HTML元素或HTML元素列表來實(shí)例化它。 <script>

如果要添加事件,可以這樣:

<input id="foo" value="這里是內(nèi)容"> <button class="btn" data-clipboard-target="#foo">點(diǎn)擊復(fù)制</button> <script src="dist/clipboard.min.js"></script> <script>var clipboard = new Clipboard('.btn');clipboard.on('success', function(e) {alert("復(fù)制成功!");e.clearSelection();});clipboard.on('error', function(e) {alert("復(fù)制失敗!");}); <script>

支持的瀏覽器如下:

?


還有更多例子以及下載請看官網(wǎng):https://clipboardjs.com/

或者直接下載:https://github.com/zenorocha/clipboard.js/archive/master.zip

本文地址:https://www.huoduan.com/clipboardjs.html

本文作者:火端網(wǎng)絡(luò),轉(zhuǎn)載請務(wù)必以超鏈接形式注明出處。

clipboard.js基本使用:http://www.jianshu.com/p/3f8867de041e

?

轉(zhuǎn)載于:https://www.cnblogs.com/cang12138/p/7798006.html

總結(jié)

以上是生活随笔為你收集整理的用clipboard.js实现纯JS复制文本到剪切板的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯,歡迎將生活随笔推薦給好友。