jquery.zclip轻量级复制失效问题


Posted in Javascript onJanuary 08, 2017

工作原理

利用一个透明的 Flash ,让其漂浮在按钮之上,这样其实点击的不是按钮而是 Flash ,也就可以使用 Flash 的复制功能了

<script src="js/jquery/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="js/jquery-zclip/jquery.zclip.js"></script>
<script type="text/javascript">
 $(function(){
    var $copyBtn = $('#copy-video-link');
    copyVideoLink($copyBtn);
  });
  //复制视频网址
  function copyVideoLink($that){
    //设置flash动画
    ZeroClipboard.setMoviePath("js/jquery-zclip/ZeroClipboard.swf");
    var clip = new ZeroClipboard.Client();
    // 设置鼠标为手型
    clip.setHandCursor(true);
    //设置要复制的文本 
    clip.setText($that.attr("data-href"));
    clip.glue($that.attr("id"));
     
    //复制完成后的监听事件    
    clip.addEventListener('complete', function (client, text) {
      alert("你已经复制成功" + text);
      // 复制一次后,hide()使复制按钮失效,防止重复计算使用次数
    });
  }
</script>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
一个js封装的不错的选项卡效果代码
Feb 15 Javascript
11款基于Javascript的文件管理器
Oct 25 Javascript
JS+flash实现chrome和ie浏览器下同时可以复制粘贴
Sep 22 Javascript
三种方式获取XMLHttpRequest对象
Apr 21 Javascript
js控制鼠标事件移动及移出效果显示
Oct 19 Javascript
DOM基础教程之使用DOM设置文本框
Jan 20 Javascript
JavaScript编写带旋转+线条干扰的验证码脚本实例
May 30 Javascript
form表单转Json提交的方法(推荐)
Sep 23 Javascript
IntelliJ IDEA 安装vue开发插件的方法
Nov 21 Javascript
页面点击小红心js实现代码
May 26 Javascript
Vue表单及表单绑定方法
Sep 04 Javascript
JS数组Reduce方法功能与用法实例详解
Apr 29 Javascript
JavaScript &amp; jQuery完美判断图片是否加载完毕
Jan 08 #Javascript
纯javaScript、jQuery实现个性化图片轮播【推荐】
Jan 08 #Javascript
js实现选项卡内容切换以及折叠和展开效果【推荐】
Jan 08 #Javascript
Javascript 实现计算器时间功能详解及实例(二)
Jan 08 #Javascript
JS 实现计算器详解及实例代码(一)
Jan 08 #Javascript
详解百度百科目录导航树小插件
Jan 08 #Javascript
Three.js基础部分学习
Jan 08 #Javascript
You might like
基于empty函数的输出详解
2013/06/17 PHP
Laravel框架模板继承操作示例
2018/06/11 PHP
javascript 操作Word和Excel的实现代码
2009/10/26 Javascript
使用JQuery进行跨域请求
2010/01/25 Javascript
编写Js代码要注意的几条规则
2010/09/10 Javascript
原生Js页面滚动延迟加载图片实现原理及过程
2013/06/24 Javascript
从js向Action传中文参数出现乱码问题的解决方法
2013/12/29 Javascript
JavaScript从数组中删除指定值元素的方法
2015/03/18 Javascript
JavaScript返回网页中锚点数目的方法
2015/04/03 Javascript
jquery实现的用户注册表单提示操作效果代码分享
2015/08/28 Javascript
图解js图片轮播效果
2015/12/20 Javascript
微信小程序开发之相册选择和拍照详解及实例代码
2017/02/22 Javascript
Angular 1.x个人使用的经验小结
2017/07/19 Javascript
[js高手之路]HTML标签解释成DOM节点的实现方法
2017/08/31 Javascript
Node 自动化部署的方法
2017/10/17 Javascript
详解Vue结合后台的列表增删改案例
2018/08/21 Javascript
Vue作用域插槽slot-scope实例代码
2018/09/05 Javascript
Vue.js实现开发购物车功能的方法详解
2019/02/22 Javascript
深入浅析Vue中mixin和extend的区别和使用场景
2019/08/01 Javascript
vue+animation实现翻页动画
2020/06/29 Javascript
使用django和vue进行数据交互的方法步骤
2019/11/11 Python
Django media static外部访问Django中的图片设置教程
2020/04/07 Python
python学习将数据写入文件并保存方法
2020/06/07 Python
Python request中文乱码问题解决方案
2020/09/17 Python
详解CSS3中border-image的使用
2015/07/18 HTML / CSS
如果有两个类A,B,怎么样才能使A在发生一个事件的时候通知B
2016/03/12 面试题
毕业生自我鉴定范文
2013/11/08 职场文书
会计实习生自我鉴定
2013/12/12 职场文书
家长评语大全
2014/01/22 职场文书
银行工作检查书范文
2014/01/31 职场文书
领导班子个人查摆问题对照检查材料
2014/10/02 职场文书
学生自我评语
2015/01/04 职场文书
关于国庆节的广播稿
2015/08/19 职场文书
小学中队委竞选稿
2015/11/20 职场文书
广播稿:校园广播稿范文
2019/04/17 职场文书
表扬稿表扬信的格式及范文
2019/06/24 职场文书