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 相关文章推荐
JavaScript 无符号右移赋值操作
Apr 17 Javascript
js tab效果的实现代码
Dec 26 Javascript
JavaScript DOM 学习第九章 选取范围的介绍
Feb 19 Javascript
js给dropdownlist添加选项的小例子
Mar 04 Javascript
jQuery实现仿路边灯箱广告图片轮播效果
Apr 15 Javascript
picLazyLoad 实现图片延时加载(包含背景图片)
Jul 21 Javascript
微信小程序 scroll-view组件实现列表页实例代码
Dec 14 Javascript
详解webpack介绍&amp;安装&amp;常用命令
Jun 29 Javascript
详解react、redux、react-redux之间的关系
Apr 11 Javascript
详解如何配置vue-cli3.0的vue.config.js
Aug 23 Javascript
微信小程序使用前置摄像头拍照
Oct 22 Javascript
Vue项目如何引入bootstrap、elementUI、echarts
Nov 26 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实现有趣的人品测试程序实例
2015/06/08 PHP
PHP面向对象五大原则之接口隔离原则(ISP)详解
2018/04/04 PHP
ECMAScript 基础知识
2007/06/29 Javascript
js判断样式className同时增加class或删除class
2013/01/30 Javascript
JavaScript的Module模式编程深入分析
2013/08/13 Javascript
Jqgrid之强大的表格插件应用
2015/12/02 Javascript
jQuery基于cookie实现的购物车实例分析
2015/12/24 Javascript
基于jQuery实现二级下拉菜单效果
2016/02/01 Javascript
jQuery Validate插件实现表单验证
2016/08/19 Javascript
JavaScript页面实时显示当前时间实例代码
2016/10/23 Javascript
jQuery绑定事件的四种方式介绍
2016/10/31 Javascript
jquery实现input框获取焦点的方法
2017/02/06 Javascript
微信小程序 合法域名校验出错详解及解决办法
2017/03/09 Javascript
javascript内存分配原理实例分析
2017/04/10 Javascript
详解webpack4多入口、多页面项目构建案例
2018/05/25 Javascript
利用原生JavaScript实现造日历轮子实例代码
2019/05/08 Javascript
Emberjs 通过 axios 下载文件的方法
2019/09/03 Javascript
Vue v-model组件封装(类似弹窗组件)
2020/01/08 Javascript
Python列表计数及插入实例
2014/12/17 Python
Python文件和目录操作详解
2015/02/08 Python
python使用fork实现守护进程的方法
2017/11/16 Python
Python利用 utf-8-sig 编码格式解决写入 csv 文件乱码问题
2020/02/21 Python
python 实现&quot;神经衰弱&quot;翻牌游戏
2020/11/09 Python
python在地图上画比例的实例详解
2020/11/13 Python
在HTML5中如何使用CSS建立不可选的文字
2014/10/17 HTML / CSS
html5视频常用API接口的实战示例
2020/03/20 HTML / CSS
用Python匹配HTML tag的时候,<.*>和<.*?>有什么区别
2012/11/04 面试题
教师岗位职责
2013/11/17 职场文书
电子商务自荐书范文
2014/01/04 职场文书
将相和教学反思
2014/02/04 职场文书
大学新生军训方案
2014/05/03 职场文书
小学国庆节活动总结
2015/03/23 职场文书
2015年企业工作总结范文
2015/04/28 职场文书
大学生就业意向书
2015/05/11 职场文书
迎新生晚会主持词
2015/06/30 职场文书
Mysql InnoDB 的内存逻辑架构
2022/05/06 MySQL