与老涂一起写代码

手机端H5复制,JS实现点击复制功能

admin 315 ℃ 0 条
手机端H5复制,JS实现点击复制功能

准备工作,下载clipboard.js文件 

clipboad.js文件


前端HTML代码:

<span id="copy" >点击按钮后,这里的内容将被复制</span> <button class="btn" data-clipboard-action="copy"  data-clipboard-target="#copydata" type="button">点击复制</button>

相关js代码:

$(function(){	var clipboard = new ClipboardJS('.btn');

	clipboard.on('success', function(e) {		console.info('Action:', e.action);		console.info('Text:', e.text);		console.info('Trigger:', e.trigger);
		alert('成功!');
		
	});

	clipboard.on('error', function(e) {		console.error('Action:', e.action);		console.error('Trigger:', e.trigger);
		alert('失败!');
	});

})

注意:这里要引入了jquery,不然无法执行。


从上面代码可以看出,data-clipboard-target 绑定了复制的内容的ID

class="btn" data-clipboard-action="copy"


上一篇:百度地图多点坐标标记功能实现

下一篇:没有了

发表评论 (已有0条评论)

快来评论,快来抢沙发吧~