H5移动端和PC端网页按钮点击复制输入框功能

最新推荐文章于 2024-08-09 14:38:03 发布

ajaxPost293614

最新推荐文章于 2024-08-09 14:38:03 发布

阅读量885

点赞数 1

分类专栏： JavaScript 小技巧 HTML5

本文链接：https://blog.csdn.net/caoyan0829/article/details/84982831

版权

小技巧同时被 3 个专栏收录

152 篇文章 2 订阅

订阅专栏

JavaScript

104 篇文章 0 订阅

订阅专栏

HTML5

41 篇文章 0 订阅

订阅专栏

移动端要引入一个插件

地址：https://github.com/zenorocha/clipboard.js/wiki/CDN-Providers

<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script>

<input id="copycode" class="main-code" readonly value="" >
<button class="main-btn" data-clipboard-target="#copycode" data-clipboard-action="copy">复制</button>

js：

var copyBtn = new ClipboardJS('.main-btn');
// console.log(copyBtn)
		
copyBtn.on("success",function(element){
	// 复制成功
	alert("已复制好，可贴粘");
	element.clearSelection();
});
copyBtn.on("error",function(element){
	//复制失败；
	console.log( "复制失败，请手动复制" )
});