Js 实现剪切板复制功能

本文介绍了JavaScript实现剪切板复制功能的五种方法,包括原生JS、JQuery、IE专用方法、使用clipboard.js插件以及Flash插件zeroclipboard。详细讲解了每种方法的适用场景、优缺点及兼容性,并提供了相应的代码示例。
摘要由CSDN通过智能技术生成
需求场景:

在这里插入图片描述
显示复制链接的按钮,将当前浏览器url地址复制到剪切板。
如下:
方法一、方法二:点击按钮,将输入框的内容复制到剪切板。
方法四:点击按钮,复制当前url到剪切板。
方法三:IE专用。
移动端浏览器,PC端浏览器测试。

方法一:

使用原生Js,核心方法document.execCommand("Copy");
自测可以使用的浏览器:ie9+,Chrome71,firefox63,360,Edge(Safari5不能使用)

<textarea id="textarea1">复制链接【原生】</textarea>
<input type="button" onClick="shareUrlJs()" value="复制链接【原生】" />
<script type="text/javascript">
function shareUrlJs(){
	var t = document.getElementById("textarea1");
	t.select(); // 选择对象
	document.execCommand("Copy"); // 执行浏览器复制命令
	alert("复制成功");
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值