js 實現複製功能-Chrome下親測可用
阿新 • • 發佈:2019-06-30
最近通過JS在Chrome實現複製功能,在網上找了很多例子都不管用,最後找到了解決方案,通過clipboard來實現。希望對前端不熟悉的夥伴們一點幫助。
- 先引入js
<script src="http://lib.baomitu.com/clipboard.js/1.7.1/clipboard.min.js"></script>
- HTML程式碼
<td id="copyDataButton" class="ui-pg-button ui-corner-all pdlr10 copy" data-clipboard-text="要複製的內容" title="複製連結"> <div class="ui-pg-div"> <span class="ui-icon ace-icon fa fa-repeat ui-icon-funs"> <i>複製連結</i> </span> </div> </td>
- JS程式碼
<script type="text/javascript"> var clipboard = new Clipboard('.copy'); clipboard.on('success', function (e) { layer.msg("複製成功"); }); clipboard.on('error', function(e) { document.querySelector('.copy'); }); $("#copyDataButton").on("click",function(e){ $(this).attr("data-clipboard-text","設定成你要複製的新內容"); }); </script>
- 到此結束,點選copyDataButton按鈕,就可以實現複製功能了,在Chrome下