js实现点击复制到粘贴板功能

最新推荐文章于 2023-08-15 22:07:33 发布

原创最新推荐文章于 2023-08-15 22:07:33 发布 · 3.8k 阅读

3 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

前端

当前文章被收录于：

前端

8 篇文章 0 人学习

订阅专栏查看详情

当前文章被以下社区和专栏收录：

本文介绍了一种使用HTML和JavaScript实现微信ID复制功能的方法。通过分析HTML结构和JS代码，展示了如何利用jQuery选择器和浏览器的剪贴板API来实现一键复制功能。

HTML结构

<p class="DzWx">
   <span class="wx">微信：<span id="wxContent"> 22</span></span>
   <button class="copy" id="copyId">复制</button>
</p>

js代码

$(".copy")[0].onclick = function(){
 	 var txt = $('#wxContent').text();
     Copy(txt);
}
// 复制微信号函数
function Copy(str) {
	var save = function(e) {
		e.clipboardData.setData('text/plain', str);
		e.preventDefault();
	};
	document.addEventListener('copy', save);
	document.execCommand('copy');
	document.removeEventListener('copy', save);
	console.log('复制成功');
}