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