当开发者需要对某局部文本进行点击复制效果时,在IE下实现比较简单 。但要想做到跨浏览器比较困难了 。Zero Clipboard 它利用 Flash 进行复制,所以只要浏览器装有 Flash 就可以运行,而且比IE的document.execCommand(“Copy”) 更加灵活 。
Zero Clipboard 的实现原理
Zero Clipboard 利用 Flash 进行复制,之前有 Clipboard Copy 解决方案,其利用的是一个隐藏的 Flash 。但最新的 Flash Player 10 只允许在 Flash 上进行操作才能启动剪贴板 。所以 Zero Clipboard 对此进行了改进,用了一个透明的 Flash ,让其漂浮在按钮之上,这样其实点击的不是按钮而是 Flash ,也就可以使用 Flash 的复制功能了 。
Zero Clipboard 特点介绍:
兼容支持Flash 10
避免使用第三方浏览器插件(的Adobe Flash浏览器中的安全冲突)
无形的覆盖,无干扰,页面设计
支持CSS“悬停”和“活跃”状态
保留目标元素的“点击”,”mouseenter”和”mouseleave”的事件
供应回调函数“复制前”和“复制”
极轻的重量! (7KB精缩)
首先下载 Zero Clipboard ,并解压缩 。其中需要两个文件:ZeroClipboard.js 和 ZeroClipboard.swf ,将这两个文件放入到你的项目中 。
用法:
1.) 首先引入核心文件
2.) 在页面代码里写入功能模块,定义copy复制按钮元素属性信息
【Jquery跨浏览器文本复制插件Zero Clipboard的使用方法】例一:
例二:
点击复制效果预览:
3.) 供应定制的回调函数 。
3.) 默认参数 。
扩展介绍:
1.) 测试兼容IE6,IE7,IE8,FF 3.6,Chrome浏览器8,Safari 5的,歌剧11
2.) 适当的CSS特效:
推荐阅读
- 360浏览器使用中常见10大问题的解决方法
- QQ浏览器但不开提示安装文件已损坏该怎么办?
- JavaScript获取浏览器信息的方法
- 解决ThinkPHP下使用上传插件Uploadify浏览器firefox报302错误的方法
- Win10 Edge浏览器怎么修改默认搜索引擎?
- Win10 TH2正式版中的Edge浏览器只有签名程序才能安装
- Chrome浏览器Shockwave Flash总是崩溃的两种解决办法
- jQuery实现图片上传和裁剪插件Croppie
- 推荐阅读的js快速判断IE浏览器 兼容IE10与IE11
- Win10全新Edge浏览器F12开发人员工具更新 可测试网页运行情况