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做 ...
随机推荐
- Android和JavaScript相互调用的方法
转载地址:http://www.jb51.net/article/77206.htm 这篇文章主要介绍了Android和JavaScript相互调用的方法,实例分析了Android的WebView执行 ...
- .NET平台开源项目速览(16)C#写PDF文件类库PDF File Writer介绍
1年前,我在文章:这些.NET开源项目你知道吗?.NET平台开源文档与报表处理组件集合(三)中(第9个项目),给大家推荐了一个开源免费的PDF读写组件 PDFSharp,PDFSharp我2年前就看过 ...
- 如何在ASP.Net创建各种3D图表
我们都知道,图表在ASP.NET技术中是一种特别受欢迎而又很重要的工具.图表是表示数据的图形,一般含有X和Y两个坐标轴.我们可以用折线,柱状,块状来表示数据.通过图表控件,我们即能表示数据又能比较各种 ...
- C# await和async
基础阅读:http://www.cnblogs.com/jesse2013/p/async-and-await.html 答疑阅读:http://www.cnblogs.com/heyuquan/ar ...
- JAVA 分页工具类及其使用
Pager.java package pers.kangxu.datautils.common; import java.io.Serializable; import java.util.List; ...
- linux拷贝命令,移动命令
http://blog.sina.com.cn/s/blog_7479f7990101089d.html
- On cloud, be cloud native
本来不想起一个英文名,但是想来想去都没能想出一个简洁地表述该意思的中文释义,所以就用了一个英文名称,望见谅. Cloud Native是一个刚刚由VMware所提出一年左右的名词.其表示在设计并实现一 ...
- Windows Server 2008 小操作汇总
用惯了Windows2003,去配置2008的时候还真有点摸不着头脑.干脆把有用到的都列在这里,方便后续查找. 一.安装IIS.Telnet 点击:开始 -> 管理工具 -> 服 ...
- STM32基于HAL库通过DMA读写SDIO
通过STM32CUBEMX生成DMA读写sdio的工程,再读写过程中总会卡死在DMA中断等待读写完成的while中,最终发现while等待的标志在SDIO的中断里置位的,而SDIO中断优先级如果小于或 ...
- Objective-C runtime初识
Objective-C Runtime Describes the macOS Objective-C runtime library support functions and data struc ...