ZeroclipboardJS+flash实现将内容复制到剪贴板实例

Zeroclipboard 的实现原理
Zeroclipboard 利用 Flash
进行复制,之前有 Clipboard Copy 解决方案,其利用的是一个隐藏的 Flash。但最新的 Flash Player 10 只允许在
Flash 上进行操作才能启动剪贴板。所以 Zero Clipboard 对此进行了改进,用了一个透明的 Flash
,让其漂浮在按钮之上,这样其实点击的不是按钮而是 Flash ,也就可以使用 Flash 的复制功能了。

如何使用 Zeroclipboard
首先下载 Zeroclipboard,并解压缩。其中需要两个文件:ZeroClipboard.js 和 ZeroClipboard.swf ,将这两个文件放入到你的项目中。

其次,该效果只能放在服务器上后才能看到,所以,你可以在你的PC的IIS中建立一个虚拟的项目即可。

效果如下:

话不多说,直接上代码:

引用:

<script src="jquery.min.js"></script>
<script src="jquery.ZeroClipboard.js"></script>

HTML code:

<input type="text" id="txt" class="txt" />
<input type="button" value="点击复制" id="copy" class="copy" data-clipboard-target="txt" />

JS code:

<script>
$(function(){
    //复制URL
    var clip = new ZeroClipboard(document.getElementById("copy"),{
      moviePath: "ZeroClipboard.swf"
    });

    //复制成功
    clip.on(‘complete‘, function(client, args){
        //args.text
       alert("已经复制到剪贴板");
    });
    })
</script>

点击下载ZeroclipboardJS+flash实现将内容复制到剪贴板实例DEMO

时间: 2024-11-05 11:30:36

ZeroclipboardJS+flash实现将内容复制到剪贴板实例的相关文章

js 将内容复制到剪贴板

js 将内容复制到剪贴板 CreationTime--2018年7月1日15点06分 Author:Marydon function copyToClipboard(txt) { if(window.clipboardData){ // 清空剪贴板 window.clipboardData.clearData(); // 赋值 window.clipboardData.setData("Text", txt); alert('复制成功!') }else{ alert('请手动复制!')

Xshell选中的同时把内容复制到剪贴板(还可以设置设置文本分隔符)

1.设置对话框 工具 -> 选项 -> 键盘和鼠标 -> 将选定的文本自动复制到剪贴板 2.贴图如下 2.1.打开设置对话框 2.2.设置键盘鼠标 作者:风波 mail : [email protected]

使用ZeroClipboard解决跨浏览器复制到剪贴板的问题

Zero Clipboard的实现原理 Zero Clipboard 利用透明的Flash让其漂浮在复制按钮之上,这样其实点击的不是按钮而是 Flash ,这样将需要的内容传入Flash,再通过Flash的复制功能把传入的内容复制到剪贴板. Zero Clipboard的安装方法 首先需要下载 Zero Clipboard的压缩包,解压后把文件夹中两个文件:ZeroClipboard.js 和 ZeroClipboard.swf 放入到你的项目中. 然后把在你要使用复制功能的页面中引入Zero

ZeroClipboard 复制到剪贴板

使用 ZeroClipboard 可以简单的将内容复制到剪贴板,通过 Adobe Flash 和 JavaScript 来实现.“Zero” 意义为这个类库没有界面,界面需要由你来建立. 版本: ZeroClipboard v2.1.6 github地址 在线实例 实例预览 ZeroClipboard 复制到剪贴板 简单示例 使用方法 载入 JavaScript 文件 <script src="ZeroClipboard.js"></script> 复制 如果

使用JavaScript读取所选文本并将其复制到剪贴板

询问大多数开发人员如何将用户选择的内容复制到剪贴板,他们会提到Flash的需求(因此Zeroclipboard等脚本的流行 ).然而,这种想法的调整现在归功于最近浏览器对JavaScript中关键技术的支持的改进,这使得复制到剪贴板本身成为可能.这种JavaScript方法在IE9 +,Firefox 41+和Chrome 42+中得到支持,最终为浏览器本身带来了原生剪切/复制支持.在本教程中,我们将看到如何阅读用户选择的文本内容,动态选择页面上的一些文本,最后但并非最不重要的是,将所选内容复制

Android 复制文本内容到系统剪贴板(自由复制)

直接上代码:(对应的类:android.content.ClipboardManager) //获取剪贴板管理器: ClipboardManager cm = (ClipboardManager) getSystemService(Context.CLIPBOARD_SERVICE); // 创建普通字符型ClipData ClipData mClipData = ClipData.newPlainText("Label", "这里是要复制的文字"); // 将Cl

黄聪:JS实现复制到剪贴板功能,兼容所有浏览器(转)

两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能会更大.成长以来,很多朋友也听说到不少激励自己上进的话,但不是每个人都能一直坚持做下来,其实,这个跟自己的性格以及周围的环境都有很大关系,只能说多找方法.条件给自己鼓励,不断提高对自己的要求,才有机会获得多一点的成就. 今年下半年打算在组内建个叫『移动开发指南』的站点,在网站框架搭建过程,有一个功能

【转】js实现复制到剪贴板功能,兼容所有浏览器

两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能会更大.成长以来,很多朋友也听说到不少激励自己上进的话,但不是每个人都能一直坚持做下来,其实,这个跟自己的性格以及周围的环境都有很大关系,只能说多找方法.条件给自己鼓励,不断提高对自己的要求,才有机会获得多一点的成就. 今年下半年打算在组内建个叫『移动开发指南』的站点,在网站框架搭建过程,有一个功能

JQuery实现复制到剪贴板功能

在网页中实现复制到剪贴板功能,有两种方法, 第1种方法:使用JavaScript自带的方法,但是这种方法只能在IE下使用. document.execCommand("Copy"); // 执行浏览器复制命令 alert("已复制好,可贴粘."); 或者 window.clipboardData.setData("Text","要复制的内容"); alert("已复制好,可贴粘."); 第2种方法:使用Jq