轩枫阁

首页 / 授人以渔 / Javascript / “复制到剪切板”的多种浏览器兼容方案

“复制到剪切板”的多种浏览器兼容方案

前言

现在有很多地方需要复制,由于安全问题,浏览器的限制越来越严,实现方法也越来越有限window.clipboardData仅在IE上支持,Components.interfaces.nsIClipboard在FF上需要进行设置才能支持。

分析

现在网上比较流行的解决方案是利用flush作为桥梁,主要有:

1、Clipboard Copy,这个方法只支持flash 9,不支持flash 10。因为flash10中规定了只有在swf上进行了真实的操作(比如鼠标点击)才能访问剪切板,而上述方法只是使用了一个隐藏的swf文件,通过javascript操作flash的剪贴板,用户并没有对swf文件进行真实的操作,因此这个方法也就失效了。

2、Zero Clipboard,利用这个js库可以支持利用flash 10 实现复制到剪贴板。这个方法原理是在一个透明的flash(对用户来说是不可见的)上覆盖一个dom元素比如button或div,当点击这个dom时,实际点击的是flash,从而访问flash的剪贴板。

Zero Clipboard 例子

demo地址:http://xuanfengge.com/demo/201402/copy/

tip: 项目需要在服务器环境下运行

说明

1、如果 ZeroClipboard.swf 与页面不在同一个目录下,可以设置路径

2、调用 可以传递一个元素或者一个元素数组。

注意:ZeroClipboard不同版本之间的调用有一些细微的不同,使用的时候要主要了。

最后,浏览器的复制到此为止还是不完美的,用户的flash版本问题,还是很关键的,最好的解决是能不用的就不用,使用其他替代方案了

进阶使用

详细的用法请到下面的站点

附ZeroClipboardzeroclipboard-1.2.1

http://www.steamdev.com/zclip/

https://github.com/zeroclipboard/zeroclipboard(ZeroClipboard.min.js、ZeroClipboard.swf请在此下载)

222/430
224/430

相关文章

文章评论

纸飞机许愿

x

钢琴节奏

请选择弹奏的曲谱

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 1
    • 2

    [返回曲谱列表]