jquery zclip 复制黏贴功能不能实现

按照http://www.steamdev.com/zclip/我实现一个简单的zclip test

以下是我的测试code:

jquery zclip 复制黏贴功能不能实现
<!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>
jquery zclip 复制黏贴功能不能实现

但它不能实现预期的效果。分析原因有两个:

1》ZeroClipboard.swf有问题,需要重新下载一个

2》但是我放入复杂的框架里,它不能实现相应效果。检查我发现它的位置有问题:就是说我所点击的按钮和zclip的位置并不重合,所以没有起作用。

jquery zclip 复制黏贴功能不能实现
<div class="zclip" id="zclip-ZeroClipboardMovie_1" style="position: absolute; left: 48px; top: 56px; width: 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&amp;width=44&amp;height=22" wmode="transparent"></div>
jquery zclip 复制黏贴功能不能实现

详细修改可以参照:http://cheny.sh.blog.163.com/blog/static/49675535201305111141867/

jquery zclip 复制黏贴功能不能实现

上一篇:javascript中ajax post实例详解


下一篇:JS图片延迟加载分析及简单的demo