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

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

  1. javascript 将内容复制到剪贴板

      javascript 将内容复制到剪贴板 CreateTime--2017年9月19日11:36:50 Author:Marydon js 操作剪贴板 1.设置剪贴板内容 UpdateTime-- ...

  2. js 将内容复制到剪贴板

      js 将内容复制到剪贴板 CreationTime--2018年7月1日15点06分 Author:Marydon function copyToClipboard(txt) { if(windo ...

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

    1.设置对话框 工具 -> 选项 -> 键盘和鼠标 -> 将选定的文本自动复制到剪贴板 2.贴图如下 2.1.打开设置对话框 2.2.设置键盘鼠标,左键复制 2.3.右键粘贴 作者: ...

  4. Xshell选中的同时把内容复制到剪贴板

    1.设置对话框 工具 -> 选项 -> 键盘和鼠标 -> 将选定的文本自动复制到剪贴板 2.贴图如下 2.1.打开设置对话框 2.2.设置键盘鼠标,左键复制

  5. js将内容复制到剪贴板

    有一需求,点击按钮要将某个值复制到剪贴板. 第一种,代码如下: <div cols="20" id="biao1">12345678</div ...

  6. javascript : 点击按钮,把某标签中的内容复制到剪贴板

    需求如题. 静态页面如下. 需要的库:jquery(不用应该也能做). 浏览器:PC chrome 68 Mobile MIUI9.5(Android 7) <p>1.用电脑打开网址:&l ...

  7. Windows系统下在Git Bash中把文件内容复制到剪贴板的命令

    众所周知,在OS系统中,复制文件内容到剪贴板(比如复制公钥到剪贴板)的命令是: pbcopy < ~/.ssh/id_rsa.pub 在Win7或者Win10下这条命令就没用了.可以这样: cl ...

  8. clipboard.js实现页面内容复制到剪贴板

    clipboard.js实现复制内容到剪切板,它不依靠flash以及其他框架,应用起来比较简单 <input type="text" name="copy_txt& ...

  9. Salesforce LWC学习(二十八) 复制内容到系统剪贴板(clipboard)

    本篇参考: https://developer.mozilla.org/zh-CN/docs/Mozilla/Add-ons/WebExtensions/Interact_with_the_clipb ...

随机推荐

  1. Jquery获取iframe子/父窗口中的标签

    获取子窗口中的标签: $("#id",document.frames('iframename').document); 获取父窗口中的标签: $('#id', parent.doc ...

  2. hdu 5000 dp **

    题目中提到  It guarantees that the sum of T[i] in each test case is no more than 2000 and 1 <= T[i]. 加 ...

  3. [Linux] 取得服务器版本

    1) 登录到服务器执行 lsb_release -a ,即可列出所有版本信息,例如: [root@3.5.5Biz-46 ~]# lsb_release -a LSB Version: 1.3 Dis ...

  4. 非正规写法获取不到tr,td

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. 【转】备份Kylin的元数据

    http://blog.csdn.net/jiangshouzhuang/article/details/51290239 Kylin组织它所有的元数据(包括cube descriptions and ...

  6. BroadCast,BroadCastReceiver

    效果是:一个MainActivity动态注册一个BroadcastReceiver,BActivity发送一个标准广播,MainActivity接收到广播后,将广播中的消息显示在MainActivit ...

  7. [bzoj1071]组队[单调指针乱搞]

    这道题也很感人,主要改了比较久的时间... bzoj第一页的题,居然只过了五百多个人,(我是第512,orzliyicheng是513) 代码不长,但是细节搞了很久,主要sort写错了,晕... 首先 ...

  8. gridview自定义排序

    效果如图: 首先允许排序:AllowSorting="True":开启gridview的排序事件onsorting="GridView1_Sorting",也可 ...

  9. CSS中文字体对照表

    http://hotoo.googlecode.com/svn/trunk/labs/css/css-fonts.html CSS中文字体对照表 css字体名可以使用2种Unicode格式,以“微软雅 ...

  10. 【原】iOS学习41之多线程

    1. 多线程概述 1> 程序.进程和进程的概念 程序:由源代码生成的可执行应用.(例如:QQ.app) 进程:一个正在运行的程序可以看做一个进程.(例如:正在运行的QQ就是一个进程),进程拥有独 ...