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 相关文章推荐
兼容Mozilla必须知道的知识。
Jan 09 Javascript
javascript parseInt 大改造
Sep 27 Javascript
jquery 检测元素是否存在的实例代码
Nov 19 Javascript
JavaScript实现仿淘宝商品购买数量的增减效果
Jan 22 Javascript
纯JS焦点图特效实例(可一个页面多用)
Dec 07 Javascript
函数四种调用模式以及其中的this指向
Jan 16 Javascript
jQuery插件FusionWidgets实现的Bulb图效果示例【附demo源码下载】
Mar 23 jQuery
jQuery+ajax实现局部刷新的两种方法
Jun 08 jQuery
vue的style绑定background-image的方式和其他变量数据的区别详解
Sep 03 Javascript
ES6 对象的新功能与解构赋值介绍
Feb 05 Javascript
JS面向对象编程实现的Tab选项卡案例详解
Mar 03 Javascript
vue实现登陆页面开发实践
May 30 Vue.js
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
PHP4实际应用经验篇(7)
2006/10/09 PHP
支持中文的php加密解密类代码
2011/11/27 PHP
php操作memcache缓存方法分享
2015/06/03 PHP
PHP简单实现欧拉函数Euler功能示例
2017/11/06 PHP
PHP CURL与java http使用方法详解
2018/01/26 PHP
js 处理URL实用技巧
2010/11/23 Javascript
购物车选中得到价格实现示例
2014/01/26 Javascript
jquery获取html元素的绝对位置和相对位置的方法
2014/06/20 Javascript
nodejs之请求路由概述
2014/07/05 NodeJs
JS判断变量是否为空判断是否null
2014/07/25 Javascript
AngularJS学习笔记之基本指令(init、repeat)
2015/06/16 Javascript
js简单时间比较的方法
2016/08/02 Javascript
原生js实现可拖拽效果
2017/02/28 Javascript
Vue.js结合Ueditor富文本编辑器的实例代码
2017/07/11 Javascript
微信小程序中进行地图导航功能的实现方法
2018/06/29 Javascript
JS实现的简单分页功能示例
2018/08/23 Javascript
Koa日志中间件封装开发详解
2019/03/09 Javascript
基于vue、react实现倒计时效果
2019/08/26 Javascript
LayUi数据表格自定义赋值方式
2019/10/26 Javascript
前端开发之便利店收银系统代码
2019/12/27 Javascript
JS通用方法触发点击事件代码实例
2020/02/17 Javascript
基于PHP pthreads实现多线程代码实例
2020/06/24 Javascript
微信小程序弹窗禁止页面滚动的实现代码
2020/12/30 Javascript
[01:34]完美“圣”典宣传片震撼发布,12.17与你不见不散
2016/12/16 DOTA
Python使用sorted排序的方法小结
2017/07/28 Python
Python+OpenCV+图片旋转并用原底色填充新四角的例子
2019/12/12 Python
Python 使用生成器代替线程的方法
2020/08/04 Python
opencv python 对指针仪表读数识别的两种方式
2021/01/14 Python
python爬虫智能翻页批量下载文件的实例详解
2021/02/02 Python
参观监狱心得体会
2014/01/02 职场文书
简历自我评价怎么写呢?
2014/01/06 职场文书
环保公益广告语
2014/03/13 职场文书
技术合作协议书范本
2014/04/18 职场文书
论文评审意见
2015/06/05 职场文书
八年级英语教学反思
2016/02/15 职场文书
浅谈Python 中的复数问题
2021/05/19 Python