使用Zero Clipboard实现JS网页代码复制到剪贴板功能，所有浏览器全兼容
使用Zero Clipboard实现JS网页代码复制到剪贴板功能，所有浏览器全兼容
崔文远TroyCui
发布于 2019-02-26 14:57:23
发布于 2019-02-26 14:57:23
前几天，好友让我帮忙增加一个复制二维码链接的功能，虽然说这个功能在很多网站都能看到，但是你会经常看到“此功能不支持该浏览器，请手工复制文本框中内容”，这是因为大都用“window.clipboardData”来实现，但这个函数只有IE和Firefox火狐浏览器支持。
很爽快的答应了朋友，网上也搜索了一大堆，大都同样的思路，个别针对浏览器增加几个判断，但都不能兼容所有浏览器。最终从WordPress顺藤摸瓜，找到了jQuery ZeroClipboard（简称jquery-zclip），顺而找到了无需依赖jQuery的ZeroClipboard。顺利解决了问题。
相关代码
<script type="text/javascript" charset="utf-8" src="/templates/yishi/js/ZeroClipboard.min.js"></script>
<script type="text/javascript">
var client = new ZeroClipboard( document.getElementById("d_clip_button") );
client.on( "ready", function( readyEvent ) {
// alert( "ZeroClipboard SWF is ready!" );
client.on( "aftercopy", function( event ) {
// `this` === `client`
// `event.target` === the element that was clicked
//隐藏
//event.target.style.display = "none";
//alert("Copied text to clipboard: " + event.data["text/plain"] );
alert('复制成功!');
//console.log('复制成功!');
} );
} );
</script>插件相关信息
jQuery Zero官网：已不能访问，请访问Github
jQuery Zero Clipboard Github地址：https://github.com/patricklodder/jquery-zclip
Zero Clipboard的官方地址：http://zeroclipboard.org
Zero Clipboard Github地址：https://github.com/zeroclipboard/ZeroClipboard
本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2016年6月29日，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读