jquery.zclip复制内容到剪贴板兼容各浏览器【原创】

查看演示 下载资源 下载积分： 70 积分

关注公众号，免费赠送安装视频教程、环境和学习视频，后面会不断更新。

HTML

首先引入jquery.js和zclip插件。

<script type="text/javascript" src="js/jquery.js"></script> 
<script type="text/javascript" src="js/jquery.zclip.min.js"></script>

接着我们在页面中加入复制按钮和输入框

<textarea id="content">请输入内容

当点击“复制内容”时，调用zclip插件，并提示复制成功，请看代码：

$(function() {
    $('#copy_btn').zclip({
        path: 'js/ZeroClipboard.swf',
        //flash地址
        copy: function() { //复制返回值
            return $('#content').val();
        },
        afterCopy: function() { //复制后操作方法
            $("<span id='tip'/>").insertAfter($('#copy_btn')).text('复制成功，右击粘贴试试').fadeOut(2000);
        }
    });
});

值得一提的是，少数用户可能没有装flash。So我们提供一个判断用户是否安装flash，若是有继续执行上面的操作，若是没有可以提示 ”亲，请您手动复制。。“

function flashChecker() {//返回1 说明已安装falsh
    var hasFlash = 0;//初始化未安装
    if (document.all) { //IE浏览器
        var swf = new ActiveXObject('ShockwaveFlash.ShockwaveFlash');
        if (swf) {
            hasFlash = 1; //安装了falsh
        }
    } else { //其他浏览器
        if (navigator.plugins && navigator.plugins.length > 0) {
            var swf = navigator.plugins["Shockwave Flash"];
            if (swf) {
                hasFlash = 1;//安装了falsh
            }
        }
    }
    return hasFlash;//    return {f: hasFlash, v: flashVersion};
}

Zclip参数设置