背景
我们开发中可能会有点击复制的功能，那么下面将讲述
核心代码
select()方法用于选择该元素中的文本。document.execCommand('copy')执行浏览器复制命令
案例
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1"> <title></title> <style type="text/css"> .wrapper { position: relative; } #input { position: absolute; top: 0; left: 0; opacity: 0; z-index: -10; } </style> </head> <body> <div class="wrapper"> <p id="text" onclick="copyText()">复制的一段文字</p> <input id="input" value="躲起来的文本框"/> <!-- <textarea id="input">也可以使用文本框</textarea> --> <button onclick="copyText()">copy</button> </div> <script type="text/javascript"> function copyText() { var text = document.getElementById("text").innerText; var input = document.getElementById("input"); input.value = text; // 修改文本框的内容 input.select(); // 选中文本 document.execCommand("copy"); // 执行浏览器复制命令 alert("复制成功"); } </script> </body> </html>
