ZeroClipboard实现复制功能
在浏览网页时可以看到复制功能，如：在看一个带有源码的demo时，可以点击复制，把源码复制到剪切板，然后粘贴到本地review，ie浏览器可以使用浏览器内置对象(window.clipboradData)
的setData方法，但无法兼容其他浏览器，下面介绍ZeroClipboard:
一、原理
ZeroClipboard利用透明的flash让其漂浮在复制按钮之上，将需要复制的内容传入flash，在通过flash的复制功能把传入的内容复制到剪切板。
二、结构
1、ZeroClipboard其实是国外的一个js类库，源码结构如：
var ZeroClipboard = { //这里是属性和方法..... };ZeroClipboard.Client.prototype = { //扩展方法};2、创建对象，如：
var clip = new ZeroClipboard.Client();//调用扩展方法
点击这里下载文件，查看github源码，百度文库。
三、简单配置
下载下来的ZeroClipboard文件有一个js和swf文件，在js文件中需要正确配置moviePath路径，可以配置相对和绝对路径，也可以调用实例对象的moviePath()设置正确的路径。
四、domo实例
CSS:
.box { width: 300px; height: 100px; margin: 100px auto; }HTML:
<div > <textarea id="J_share_text" ></textarea> <input id="J_copy_clipboard_data" type="button" value="复制"></div>
JavaScript:
(function() { $(function() { var clip = new ZeroClipboard.Client(); clip.setHandCursor(true); clip.glue('J_copy_clipboard_data'); clip.addEventListener('mouseDown',function() { clip.setText(ZeroClipboard.$('#J_share_text').val()); }); }); })()完整demo：
<!DOCTYPE html><html><head><meta charset="utf-8" /><title>ZeroClipboard demo实例</title><link href="http://a.tbcdn.cn/apps/e/tms/120951/bootstrap.css" rel="stylesheet"><style>.box { width: 300px; height: 100px; margin: 100px auto; }</style></head><div > <textarea id="J_share_text" ></textarea> <input id="J_copy_clipboard_data" type="button" value="复制"></div><body><script src="http://a.tbcdn.cn/apps/e/tms/120951/zeroclipboard.js"></script><script src="http://code.jquery.com/jquery-1.8.1.min.js"></script><script src="http://a.tbcdn.cn/apps/e/tms/120951/bootstrap.js"></script><script>(function() { $(function() { var clip = new ZeroClipboard.Client(); clip.setHandCursor(true); clip.glue('J_copy_clipboard_data'); clip.addEventListener('mouseDown',function() { clip.setText($('#J_share_text').val()); }); }); })()</script></body></html>TAG:
