javescript 实现一键复制功能
作者:互联网
原生实现
1 function copy(data){ 2 var oInput = document.createElement("input"); 3 oInput.value = data; 4 document.body.appendChild(oInput); 5 oInput.select(); 6 document.execCommand("Copy"); 7 oInput.className = "oInput"; 8 oInput.style.display = "none"; 9 }
html实现
1 <input type="text" readonly="readonly" unselectable="on" value="mytxt" class='mytxt' style=" background: none;border: none;color: #dfc37a; "> 2 <a class="copyname" href="javascript:;">复制</a> 3 4 <script type="text/javascript"> 5 $('.copyname').click(function(){ 6 var dd = $('.mytxt'); 7 dd[0].select(); 8 document.execCommand("Copy"); 9 }); 10 </script>
使用插件 引入clipboard.js
1 <script> 2 copyFn = function() { 3 var clipboard = new Clipboard('.copy-btn', { 4 text: function(trigger) { 5 return $('.copy-txt').text(); 6 } 7 }); 8 clipboard.on('success', function() { 9 alert('复制成功!'); 10 }); 11 clipboard.on('error', function(e) { 12 alert('请手动选择文本复制!'); 13 }); 14 } 15 copyFn(); 16 </script>
标签:function,copy,clipboard,javescript,一键,复制,oInput,var,document 来源: https://www.cnblogs.com/luorende/p/16285319.html