跨浏览器的复制文本功能

js控件地址:https://github.com/zeroclipboard/zeroclipboard

指令说明:https://github.com/zeroclipboard/zeroclipboard/blob/master/docs/instructions.md

注意:这个复制功能只能放在服务器上才有用,因为swf有domain的控制trustedDomains 设置.

 

<html>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <body>
        <!--data-clipboard-target指定复制的数据源为ID为spanBox的元素-->
        <button id="btnCopy" data-clipboard-target="spanBox">点我复制</button>
        <span id="spanBox">哎呀被点到了</span>
        <script src="ZeroClipboard.min.js"></script>
        <script>
            function copyString(strBtnId) {
                //针对ie6
                if ($.browser.version == 6.0) {
                    $('#' + strBtnId).bind("click", function() {
                        strDomId = $(this).attr('data-clipboard-target');
                        window.clipboardData.setData("Text", $('#' + strDomId).val());
                        alert('复制成功');
                    })
                    return;
                }

                var config = {
                    moviePath: "http://img1.tiancitycdn.com/mh/homepage/js/ZeroClipboard20140122.swf",
                    forceHandCursor: true, //复制按钮手型提示
                    debug: false //发送控制台消息
                };
                var client = new ZeroClipboard(document.getElementById(strBtnId), config);
                client.on("load", function(client) {
                    client.on("complete", function(client, args) {
                        alert('复制成功');
                    });
                });
            }

            (function() {
                copyString('btnCopy');
            })();
        </script>
    </body>
</html>

 

posted @ 2014-01-21 15:47  耐得住寂寞  阅读(405)  评论(0)  编辑  收藏  举报