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

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

在一些网站中,我们会经常会遇到复制页面中的一段代码、URL地址、折扣码等信息,我们可以直接在页面中放置一个复制按钮,点击复制按钮,用户便可以复制内容。本文所需要的Zclip复制插件,是利用一个隐藏的flash文件来完成复制的功能,关键是它兼容当前各主流浏览器。

淘建站为您提供更多_其它特效_复制功能_复制_zclip,在此特别感谢您对我们的支持与厚爱!

查看演示

演示不了,点击反馈

加入收藏

下载 385 次

打赏作者

觉得不错,可打赏下作者

下载资源

免费共享

特别说明:本站资源来自网友发布分享,仅供学习与参考,请勿用于商业用途,若有侵权请联系删除(272966172@qq.com)。

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参数设置

参数 描述 默认值
path swf调用路径,必须,如js/ZeroClipboard.swf,ZeroClipboard.swf “ZeroClipboard.swf”
copy 复制的内容 null
回调函数

copy: function(){},

afterCopy: function(){},

beforeCopy: function(){}

-

声明:本资料由淘建站会员提供,如转载注明来源,资料来源淘建站免费素材库:https://www.taojz.cn/texiao/15.html
jquery.zclip复制内容到剪贴板兼容各浏览器 希望对你有帮助,感谢您的支持!
  • javascript屏蔽浏览器右键功能按钮

    javascript屏蔽浏览器右键功能按钮

  • js复制剪切板兼容firefox,Chrome,IE

    js复制剪切板兼容firefox,Chrome,IE

  • js屏蔽浏览器右键菜单,粘贴,复制,剪切,选中

    js屏蔽浏览器右键菜单,粘贴,复制,剪切,选中

  • js点击复制剪贴板鼠标点击文字弹出复制链接按钮

    js点击复制剪贴板鼠标点击文字弹出复制链接按钮

  • jquery复制链接点击按钮复制调用text文本框内容

    jquery复制链接点击按钮复制调用text文本框内容

  • clipboard.js制作文本复制粘贴剪切板功能代码

    clipboard.js制作文本复制粘贴剪切板功能代码

  • 留言(0)
    头像
     阿里云限量代金券,戳我领取
    1 2