Javascript实现复制文本的功能代码示例，两种实现方式
Javascript实现复制文本功能，可以通过以下两种方式：
一、原生Javascript实现；
二、通过第三方插件Clipboard.js实现复制功能。原生JS复制
示例代码
<html> <head> <title>原生Javascript实现复制功能</title> </head> <body> <div style="margin: 0 auto;width: 300px;"> <input type="text" id="inputId"><button onclick="copy()">复制</button> </div> <script> function copy() { /* 获取元素对象 */ var inputElement = document.getElementById("inputId"); /* 选择复制内容 */ inputElement.select(); /* 复制内容到文本域 */ navigator.clipboard.writeText(inputElement.value); /* 弹出已复制的内容 */ alert("复制的文本为: " + inputElement.value); } </script> </body> </html>第三方类库clipboard.js
clipboard.js官网：https://clipboardjs.com
clipboard.js Github仓库地址：
https://github.com/zenorocha/clipboard.js
示例代码
<html> <head> <title>clipboard.js实现复制功能</title> <script src="https://cdn.staticfile.org/clipboard.js/2.0.4/clipboard.min.js"></script> </head> <body> <div style="margin: 0 auto;width: 300px;"> <input type="text" id="inputId"><button id="onCopy">复制</button> </div> <script> new ClipboardJS('#onCopy', { text: function(trigger) { return document.getElementById("inputId").value; } }).on('success', function(e) { alert("复制成功"); e.clearSelection(); }).on('error', function(e) { alert('复制失败!'); }); </script> </body> </html>
本文标题：Javascript实现复制文本的功能代码示例，两种实现方式
本文链接：https://www.befun.ink/16.html
声明：本站信息原创或由互联网收集，未用于商业用途，如若侵权，请联系站长删除!
欧家崇
优秀作者 战斗力十足
1.9w
文章
312w+
阅读
635w+
访问量
相关文章