JavaScript使用ZeroClipboard操作剪切板


Posted in Javascript onMay 10, 2017

一、ZeroClipboard下载地址

为大家提供细一些ZeroClipboard的下载地址:

二、添加js引用

<script src="../Assets/js/jquery-1.8.3.min.js"></script>
 <script src="../Assets/js/ZeroClipboard/ZeroClipboard.js"></script>

三、初始化插件

$(function () {
   InitCopyToClipboard('btnCopyToClipBoard');
 });
//将内容复制到剪切板
function InitCopyToClipboard(btnId) {
ZeroClipboard.setMoviePath("../Assets/js/ZeroClipboard/ZeroClipboard.swf"); //设置flash文件在项目中的位置 
var clip = new ZeroClipboard.Client(); // 新建一个对象

clip.setHandCursor(true);
clip.addEventListener('onmouseup', function (client) { //创建监听 
 // 可以在这儿写一个方法处理相应的事件逻辑
 clip.setText('要复制到剪切板中的内容'); 
});
clip.glue(btnId); //将flash覆盖至指定ID的DOM上


//窗口大小发生变化时从新将flash覆盖至制定的id上,否则位置不对应导致点击时没反应
bind(window, "resize", function () {
  clip.reposition();
});
return false;
}

/************************************ 
* 添加事件绑定 
* @param obj : 要绑定事件的元素 
* @param type : 事件名称。不加 "on". 如 : "click" 而不是 "onclick". 
* @param fn : 事件处理函数 
************************************/
function bind(obj, type, fn) {
if (obj.attachEvent) {
obj['e' + type + fn] = fn;
obj[type + fn] = function () { obj['e' + type + fn](window.event); }
obj.attachEvent('on' + type, obj[type + fn]);
} else
obj.addEventListener(type, fn, false);
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
getElementsByTagName vs selectNodes效率 及兼容的selectNodes实现
Feb 26 Javascript
js中将URL中的参数提取出来作为对象的实现代码
Aug 16 Javascript
给jqGrid数据行添加修改和删除操作链接(之一)
Nov 04 Javascript
使用JavaScript构建JSON格式字符串实现步骤
Mar 22 Javascript
JavaScript让Textarea支持tab按键的方法
Jun 26 Javascript
javascript中SetInterval与setTimeout的定时器用法
Aug 24 Javascript
JS中使用new Date(str)创建时间对象不兼容firefox和ie的解决方法(两种)
Dec 14 Javascript
JS解决position:sticky的兼容性问题的方法
Oct 17 Javascript
jQuery实现通过方向键控制div块上下左右移动的方法【测试可用】
Apr 26 jQuery
详解JavaScript中的数组合并方法和对象合并方法
May 11 Javascript
JS获取并处理php数组的方法实例分析
Sep 04 Javascript
回顾Javascript React基础
Jun 15 Javascript
VUE 更好的 ajax 上传处理 axios.js实现代码
May 10 #Javascript
vuejs2.0子组件改变父组件的数据实例
May 10 #Javascript
详解vue.js2.0父组件点击触发子组件方法
May 10 #Javascript
详解vue-router 2.0 常用基础知识点之router-link
May 10 #Javascript
JavaScript使用readAsDataURL读取图像文件
May 10 #Javascript
angular.js指令中的controller、compile与link函数的不同之处
May 10 #Javascript
详解vue-router 2.0 常用基础知识点之导航钩子
May 10 #Javascript
You might like
暴雪前总裁遗憾:没尽早追赶Dota 取消星际争霸幽灵
2020/03/08 星际争霸
php生成0~1随机小数的方法(必看)
2017/04/05 PHP
用Javascript做flash做的事..才完成的一个类.Auntion Action var 0.1
2007/02/23 Javascript
[原创]js与自动伸缩图片 自动缩小图片的多浏览器兼容的方法总结
2007/03/12 Javascript
My Desktop :) 桌面式代码
2008/12/29 Javascript
在html页面上拖放移动标签
2010/01/08 Javascript
关于javascript function对象那些迷惑分析
2011/10/24 Javascript
js验证是否为数字的总结
2013/04/14 Javascript
在js文件中写el表达式取不到值的原因及解决方法
2013/12/23 Javascript
基于jquery实现三级下拉菜单
2016/05/10 Javascript
javascript弹出带文字信息的提示框效果
2016/07/19 Javascript
scroll事件实现监控滚动条并分页显示(zepto.js)
2016/12/18 Javascript
jQuery中的deferred对象和extend方法详解
2017/05/08 jQuery
vue引入jq插件的实例讲解
2017/09/12 Javascript
React中的refs的使用教程
2018/02/13 Javascript
安装Node.js并启动本地服务的操作教程
2018/05/12 Javascript
electron中使用bootstrap的示例代码
2018/11/06 Javascript
Js代码中的span拼接问题解决
2019/11/22 Javascript
在vue中使用console.log无效的解决
2020/08/09 Javascript
Python下的subprocess模块的入门指引
2015/04/16 Python
python获取从命令行输入数字的方法
2015/04/29 Python
python文件操作之目录遍历实例分析
2015/05/20 Python
python通过SSH登陆linux并操作的实现
2019/10/10 Python
django中media媒体路径设置的步骤
2019/11/15 Python
浅谈pytorch torch.backends.cudnn设置作用
2020/02/20 Python
使用 CSS3 中@media 实现网页自适应的示例代码
2020/03/24 HTML / CSS
详解利用canvas实现环形进度条的方法
2019/06/12 HTML / CSS
美国珠宝网上商店:Jeulia
2016/09/01 全球购物
Liu Jo西班牙官网:意大利服装品牌
2019/09/11 全球购物
人事行政主管岗位职责
2013/12/22 职场文书
优秀通讯员事迹材料
2014/01/28 职场文书
给市场的环保建议书
2014/05/14 职场文书
父亲节活动策划方案
2014/08/24 职场文书
护士2014年终工作总结
2014/11/11 职场文书
暖春观后感
2015/06/08 职场文书
jquery插件实现图片悬浮
2021/04/16 jQuery