跨浏览器的“复制到剪贴板”.续

In: 前端开发

25 08 2009

很早之前,写过一篇“跨浏览器“复制到剪贴板”的解决方案”,当时给出的解决方案是,IE使用window.clipboardData,firefox等其它浏览器使用flash来调用System.setClipboard方法。但是,随着Flash10安全策略更新,只允许在flash内部调用setClipboard方法,那篇文章给出的demo已经失效。我重新写了一个demo,见这里

新demo是在flash内部调用的setClipboard方法,原则上安装了flash的浏览器都可以用;另外,IE7及以上版本用js调用clipboardData会弹出选择是否允许的提示,往往初级用户看到这样提示还以为网站有病毒,所以这次一视同仁所有浏览器都用flash写剪切板。原理比较简单,大概说一下:

  • 页面上提供两个js方法getData和copySuccess供flash调用,getData返回需要复制的内容,copySuccess是复制成功的回调函数;
  • 往flash里添加一个任意的DisplayObject,例如TextField,注册Click事件,事件响应函数里先调用页面上的js方法getData得到粘贴内容,再用System.setClipboard写入剪切板,最后通知页面上的copySuccess。

完整的代码见这里。如果要个性化提示文字,打开clipboard.as,修改后编译即可。

再来看看这些吧

3 Responses to 跨浏览器的“复制到剪贴板”.续

Avatar

kai.ma

08月 28th, 2009 at 10:16 am

这个不错,谢谢了。我去试试看。

Avatar

jswsky

12月 2nd, 2009 at 7:16 pm

你好,好像需要swfobject.js和clipboard.swf这两个文件,能否提供一下?还有,存放位置!谢谢!

Avatar

Jerry Qu

12月 2nd, 2009 at 7:20 pm

to jswsky:
http://www.qgy18.com/lab/clipboard2/
这个demo有所需的所有文件,另存为一页面下就OK了。

Comment Form

关于我

JerryQu,当前从事前端开发,@中国北京
这里是我随便记录东西的地方~
需要找我,我的联系方式在这里 »
查找QGYWebim相关信息,请点这里 »

共享