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

浏览数：188 / 时间：2015年06月09日

按照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; 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>