前几天,好友让我帮忙增加一个复制二维码链接的功能,虽然说这个功能在很多网站都能看到,但是你会经常看到“此功能不支持该浏览器,请手工复制文本框中内容”,这是因为大都用“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