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 相关文章推荐
通用于ie和firefox的函数 GetCurrentStyle (obj, prop)
Dec 27 Javascript
JScript中的undefined和&quot;undefined&quot;的区别
Mar 08 Javascript
js+html+css实现鼠标移动div实例
Jan 30 Javascript
js 火狐下取本地路径实现思路
Apr 02 Javascript
js实现的页面加载完毕之前loading提示效果完整示例【附demo源码下载】
Aug 02 Javascript
Vue.js每天必学之方法与事件处理器
Sep 06 Javascript
详解js的六大数据类型
Dec 27 Javascript
几行js代码实现自适应
Feb 24 Javascript
Easyui ueditor 整合解决不能编辑的问题(推荐)
Jun 25 Javascript
JavaScript判断浏览器版本的方法
Nov 03 Javascript
vue.js实现照片放大功能
Jun 23 Javascript
vscode自定义vue模板的实现
Jan 27 Vue.js
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
深入探讨PHP中的内存管理问题
2011/08/31 PHP
php打造属于自己的MVC框架
2012/03/07 PHP
Drupal读取Excel并导入数据库实例
2014/03/02 PHP
PHP Reflection API详解
2015/05/12 PHP
PHP文件缓存类实现代码
2015/10/26 PHP
jquery ui 1.7 ui.tabs 动态添加与关闭(按钮关闭+双击关闭)
2010/04/01 Javascript
jquery中获取元素的几种方式小结
2011/07/05 Javascript
详解JavaScript中jQuery和Ajax以及JSONP的联合使用
2015/08/13 Javascript
JavaScript动态创建form表单并提交的实现方法
2015/12/10 Javascript
jquery.cookie实现的客户端购物车操作实例
2015/12/24 Javascript
JavaScript知识点总结(十)之this关键字
2016/05/31 Javascript
require.js+vue开发微信上传图片组件
2016/10/27 Javascript
jquery实现input框获取焦点的方法
2017/02/06 Javascript
Vue自定义指令拖拽功能示例
2017/02/17 Javascript
Angular 4.X开发实践中的踩坑小结
2017/07/04 Javascript
浅谈node中的exports与module.exports的关系
2017/08/01 Javascript
深入理解JavaScript的值传递和引用传递
2018/10/24 Javascript
react同构实践之实现自己的同构模板
2019/03/13 Javascript
Vue.use()在new Vue() 之前使用的原因浅析
2019/08/26 Javascript
JS实现简易留言板(节点操作)
2020/03/16 Javascript
JavaScript Image对象实现原理实例解析
2020/08/26 Javascript
Python中优化NumPy包使用性能的教程
2015/04/23 Python
分享一个简单的python读写文件脚本
2017/11/25 Python
解决Python一行输出不显示的问题
2018/12/03 Python
Python 字典中的所有方法及用法
2020/06/10 Python
python字符串的index和find的区别详解
2020/06/20 Python
Python爬虫制作翻译程序的示例代码
2021/02/22 Python
玩具反斗城天猫官方旗舰店:享誉全球的玩具店
2017/10/10 全球购物
人事档案接收函
2014/01/12 职场文书
宿舍违规用电检讨书
2014/02/16 职场文书
信息员培训方案
2014/06/12 职场文书
捐书倡议书
2014/08/29 职场文书
教师党的群众路线学习心得体会
2014/11/04 职场文书
检讨书范文大全
2015/05/07 职场文书
2016年大学校运会广播稿件
2015/12/21 职场文书
Python卷积神经网络图片分类框架详解分析
2021/11/07 Python