跨浏览器复制工具ZeroClipboard简介

0 0 619

1、需求

实现通过js复制百度ueditor编辑器的内容

QQ截图20170209163119

 

 

2、直接贴代码

QQ截图20170209163311

 

 

3、简介

我们希望让用户在网页上完成某个操作,即自动将指定的内容复制到用户计算机的剪贴板中。但是出于安全原因,大多数现代浏览器都未提供通用的剪贴板复制接口(或即便有,也默认被禁用)。只有IE浏览器可以通过如下方式来进行复制。

window.clipboardData.setData("Text", "这里是需要复制的文本内容")

想要实现跨浏览器的复制功能,我们就可以使用 ZeroClipboard。

ZeroClipboard 及其原理介绍

ZeroClipboard 是国外大神开发的一个用于剪贴板复制的 JS 插件,它是基于 Flash 来实现跨浏览器的复制功能的。当我们使用 ZeroClipboard 的时候,它会悄悄隐藏一个小小的 Flash 影片(swf),不会对我们的用户界面造成影响。我们只需要借助它实现复制功能就行了。ZeroClipboard 中的 “Zero” 指的就是”不可见,零干扰”。

不过从 Flash 10开始,由于浏览器和Flash的安全限制,要求用户必须在Flash区域上进行真实操作才能操作剪贴板。于是,ZeroClipboard 的作者想到一个办法:它将 Flash 做成透明的,以便于我们放在诸如链接、按钮等需要放置的任何地方。这样,用户界面看起来没有变化,当点击链接或按钮时,实际上点击是却是 Flash,从而实现复制操作。

 

4、使用

单独使用时,直接下载js文件就可以了,

如果和ueditor一起,ueditor已经包含了ZeroClipboard 的,只要引用一下就可以

 

QQ截图20170209163320

留言

电子邮件地址不会被公开。 必填项已用 * 标注

*

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>