zeroclipboard浏览器复制插件使用记录
一个简单例子：
<html>
<body>
<button id="copy-button" data-clipboard-text="Copy Me!" title="Click to copy me.">Copy to Clipboard</button>
<script src="~/Scripts/jquery-1.7.1.js"></script>
<script src="~/Scripts/ZeroClipboard.js"></script>
</body>
<script> var client = new ZeroClipboard( $("#copy-button") );
client.on('ready', function (event) { client.on('copy', function (event) {
event.clipboardData.setData('text/plain', event.target.innerHTML);
alert("复制成功");
}); client.on('aftercopy', function (event) {
//复制之后的操作，如果不是自动在本页面粘贴，请把此事件备注掉
console.log('Copied text to clipboard: ' + event.data['text/plain']);
});
}); client.on('error', function (event) {
//出错的时候该干嘛
// console.log( 'ZeroClipboard error of type "' + event.name + '": ' + event.message );
ZeroClipboard.destroy();
});
</script>
</html>
2.2版本需要引用jquery,要习惯把js代码写到页面底部，经测试，发现此代码不支持IE10/11,以下提供兼容IE的function，替换js部分即可
<script>
$(function() {
var text="取文本";
var msg="复制成功";
clipboard("btn_copy",text,msg);
}); //参数说明
//button:按钮id
//text:要复制的文本
//msg:复制成功提示文本
function clipboard(button,text,msg) { if (window.clipboardData) { //for ie
var copyBtn = document.getElementById(button);
copyBtn.onclick = function () {
window.clipboardData.setData('text', text);
alert(msg);
}
} else {
var client = new ZeroClipboard($("#" + button));
client.on('ready', function (event) { client.on('copy', function (event) {
event.clipboardData.setData("text/plain", text);
alert(msg);
});
}); client.on('error', function (event) {
ZeroClipboard.destroy();
});
}
return false;
}
</script>
zeroclipboard浏览器复制插件使用记录的更多相关文章
- ZeroClipboard / jquery.zclip.min.js跨浏览器复制插件使用中遇到的问题解决
之前写过一个淘宝优惠券连接PC端转手机端连接的小工具,当时写到将转换好的url复制到剪切板这块时解决了IE和火狐,就是没办法搞定Chrome,知道可以通过flash搞定,但是觉得太麻烦没有仔细研究. ...
- jQuery插件：跨浏览器复制jQuery-zclip
jQuery-zclip是一个复制内容到剪贴板的jQuery插件,使用它我们不用考虑不同浏览器和浏览器版本之间的兼容问题.jQuery-zclip插件需要Flash的支持,使用时记得安装Adobe F ...
- ZeroClipboard跨浏览器复制粘贴
<!DOCTYPE html> <html> <head> <title>ZeroClipboard跨浏览器复制粘贴</title> < ...
- 使用ZeroClipboard解决跨浏览器复制到剪贴板的问题
Zero Clipboard的实现原理Zero Clipboard 利用透明的Flash让其漂浮在复制按钮之上,这样其实点击的不是按钮而是 Flash ,这样将需要的内容传入Flash,再通过Flas ...
- zeroclipboard实现多浏览器复制到粘贴板功能
zeroclipboard实现多浏览器复制到粘贴板功能(单个复制按钮和多个复制按钮) 为了更好的用户体验,现在很多网站中文本框的内容只需要点击复制按钮这样就能把内容复制到粘贴板了:出于兼容性的考虑,基 ...
- jquery判断浏览器版本插件，jquery-browser.js
jquery判断浏览器版本插件,jquery-browser.js,jquery 判断是否为ie浏览器插件 >>>>>>>>>>>&g ...
- 使用JavaScript开发IE浏览器本地插件实例
使用JavaScript开发IE浏览器本地插件实例 投稿:junjie 字体:[增加 减小] 类型:转载 时间:2015-02-18我要评论 这篇文章主要介绍了使用JavaScript开发IE浏览器本 ...
- chrome浏览器视频插件
以前安装chrome浏览器flash插件是将libflashplayer.so拷贝到chrome浏览器的plugins目录下.但最近好像不行了. 于是换了另一插件:pepperflashplugin- ...
- redis主从复制以及SSDB主主复制环境部署记录（四）
redis配置主从和ssdb主主复制 参考:散尽浮华Linux下Redis主从复制以及SSDB主主复制环境部署记录 只做自己查阅. 环境要求:三台虚拟机一台做主,两台做从. 通过SSDB在redis做 ...
随机推荐
- Linux 添加新磁盘，在线扩充空间
CentOS 7开发环境中的home 目录空间满了,需要增加空间 到虚拟机上执行"ls /sys/class/scsi_host",然后重新扫描SCSI总线来添加设备.如右图.然后 ...
- 项目管理_FindBugs的使用
本章将讲述如何在Myeclipse下,使用FindBugs,静态分析工具,无需开发人员费劲就能找出代码中已有的缺陷. 一:Myeclipse下如何安装FindBugs插件 1:FindBugs插件下载 ...
- AngularJS 系列 学习笔记 目录篇
目录: AngularJS 系列 01 - HelloWorld和数据绑定 AngularJS 系列 02 - 模块 (持续更新)
- VMware下对虚拟机Ubuntu14系统所在分区sda1进行磁盘扩容
VMware下对虚拟机Ubuntu14系统所在分区sda1进行磁盘扩容 一般来说,在对虚拟机里的Ubuntu下的磁盘进行扩容时,都是添加新的分区,而并不是对其系统所在分区进行扩容,如在此链接中http ...
- OpenGL shader 中关于顶点坐标值的思考
今天工作中需要做一个事情: 在shader内部做一些空间距离上的计算,而且需要对所有的点进行计算,符合条件的显示,不符合条件的点不显示. 思路很简单,在vertex shader内知道顶点坐标,进行计 ...
- Spark Streaming+Kafka
Spark Streaming+Kafka 前言 在WeTest舆情项目中,需要对每天千万级的游戏评论信息进行词频统计,在生产者一端,我们将数据按照每天的拉取时间存入了Kafka当中,而在消费者一端, ...
- .Net中的AOP读书笔记系列之AOP介绍
返回<.Net中的AOP>系列学习总目录 本篇目录 AOP是什么? Hello,World! 小结 本系列的源码本人已托管于Coding上:点击查看,想要注册Coding的可以点击该连接注 ...
- ucos实时操作系统学习笔记——任务间通信（信号量）
ucos实时操作系统的任务间通信有好多种,本人主要学习了sem, mutex, queue, messagebox这四种.系统内核代码中,这几种任务间通信机制的实现机制相似,接下来记录一下本人对核心代 ...
- .NET 基础一步步一幕幕[面向对象前言]
面向对象前言 2017年的第一篇博文,好久不写博文了,赶紧补上,感觉在以前的<.NET 基础一步步一幕幕>系列博客中,简短的小知识点已经介绍的差不多的(PS:如果还有别的基础知识点我没有介 ...
- 使用python实现短信PDU编码
前几天入手一个3G模块,便倒腾了一下.需要发送中英文混合短信,所以采用PDU模式(不了解google ^_^). 最大问题当然就是拼接PDU编码(python这么强大,说不定有模块),果不其然找到一个 ...