按照http://www.steamdev.com/zclip/我实现一个简单的zclip test
以下是我的测试code:
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>test jquery</title> <script type="text/javascript" src="/kk/script/jquery-1.10.2.min.js"></script> <script type="text/javascript" src="/kk/script/jquery.zclip.min.js"></script> <script type="text/javascript"> $(function($){ $('#clip_order_id').zclip({ path:'/kk/script/ZeroClipboard.swf', copy:$('#value_order_id').text(), beforeCopy:function(){ $(this).css('color','#c0c0c0'); }, afterCopy:function(){ $(this).css('color','green'); } }); }); </script> </head> <body> <ul class="order_info_list"> <li class="info_label">orderId</li> <li id="value_order_id">201354</li> <li><input type="button" class="button_copy" id="clip_order_id" value="copy"></li> </ul> </body> </html>
但它不能实现预期的效果。分析原因有两个：
1》ZeroClipboard.swf有问题，需要重新下载一个。
2》但是我放入复杂的框架里，它不能实现相应效果。检查我发现它的位置有问题：就是说我所点击的按钮和zclip的位置并不重合，所以没有起作用。
<div class="zclip" id="zclip-ZeroClipboardMovie_1" style="position: absolute; left: 48px; top: 56px; 44px; height: 22px; z-index: 99;"><embed id="ZeroClipboardMovie_1" src="/kk/script/ZeroClipboard10.swf" loop="false" menu="false" quality="best" bgcolor="#ffffff" width="44" height="22" name="ZeroClipboardMovie_1" align="middle" allowscriptaccess="always" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="id=1&width=44&height=22" wmode="transparent"></div>
详细修改可以参照：http://cheny.sh.blog.163.com/blog/static/49675535201305111141867/