很多网站中会用到点击复制的效果,例如,点击复制pre的代码块,点击复制链接,点击复制淘宝代码,相信很多人都用过或者见过,那么玩转网今天分享一个js实现点击复制到剪切板的功能!
![图片[1]-使用js实现点击按钮复制目标内容-玩转网](https://www.902d.com/wp-content/uploads/2020/11/a4b89e3c35d7.png)
html代码:
<p class="copy_url singleHidden share_text_02" id="target" >https://appnsdahiuhibaxankbgsregbcj...</p>
<textarea id="input_copy" style="opacity: 0;height: 0;">这是幕后黑手</textarea>
<span class="copy_btn" id="copy_btn">复制</span>
js代码:
$("#copy_btn").click(function(){
var urls = $(".copy_url").text();
console.log(urls);
//开始复制链接
var input = document.getElementById("input_copy");
input.value = urls; // 修改文本框的内容
input.select(); // 选中文本
document.execCommand("copy"); // 执行浏览器复制命令
})
注意:这是js+jquery实现的,用的话别忘引入jquery!
© 版权声明
网站名称:玩转网
本文链接:
版权声明:知识共享署名-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)协议进行许可
本站资源仅供个人学习交流,转载时请以超链接形式标明文章原始出处,(如有侵权联系删除)
本站代码模板仅供学习交流使用请勿商业运营,严禁从事违法,侵权等任何非法活动,否则后果自负!
THE END




![Zibll子比主题-最新版本V4.2更新[10.31][更新日志]-玩转网](https://www.902d.com/wp-content/uploads/2020/11/96a3be3cf272.jpg)






