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
ZeroclipboardJS+flash实现将内容复制到剪贴板实例的更多相关文章
- javascript 将内容复制到剪贴板
javascript 将内容复制到剪贴板 CreateTime--2017年9月19日11:36:50 Author:Marydon js 操作剪贴板 1.设置剪贴板内容 UpdateTime-- ...
- js 将内容复制到剪贴板
js 将内容复制到剪贴板 CreationTime--2018年7月1日15点06分 Author:Marydon function copyToClipboard(txt) { if(windo ...
- Xshell选中的同时把内容复制到剪贴板(还可以设置设置文本分隔符)
1.设置对话框 工具 -> 选项 -> 键盘和鼠标 -> 将选定的文本自动复制到剪贴板 2.贴图如下 2.1.打开设置对话框 2.2.设置键盘鼠标,左键复制 2.3.右键粘贴 作者: ...
- Xshell选中的同时把内容复制到剪贴板
1.设置对话框 工具 -> 选项 -> 键盘和鼠标 -> 将选定的文本自动复制到剪贴板 2.贴图如下 2.1.打开设置对话框 2.2.设置键盘鼠标,左键复制
- js将内容复制到剪贴板
有一需求,点击按钮要将某个值复制到剪贴板. 第一种,代码如下: <div cols="20" id="biao1">12345678</div ...
- javascript : 点击按钮,把某标签中的内容复制到剪贴板
需求如题. 静态页面如下. 需要的库:jquery(不用应该也能做). 浏览器:PC chrome 68 Mobile MIUI9.5(Android 7) <p>1.用电脑打开网址:&l ...
- Windows系统下在Git Bash中把文件内容复制到剪贴板的命令
众所周知,在OS系统中,复制文件内容到剪贴板(比如复制公钥到剪贴板)的命令是: pbcopy < ~/.ssh/id_rsa.pub 在Win7或者Win10下这条命令就没用了.可以这样: cl ...
- clipboard.js实现页面内容复制到剪贴板
clipboard.js实现复制内容到剪切板,它不依靠flash以及其他框架,应用起来比较简单 <input type="text" name="copy_txt& ...
- Salesforce LWC学习(二十八) 复制内容到系统剪贴板(clipboard)
本篇参考: https://developer.mozilla.org/zh-CN/docs/Mozilla/Add-ons/WebExtensions/Interact_with_the_clipb ...
随机推荐
- VS2013安装oepncv2.4.10 以及opencv 3.0.0
Author:Maddock Date:2014.12.27 …………………………………………………………………………………………………… PS: VS2013 + OPENCV 3.0.0 的安装, ...
- 【JSON 注解】JSON循环引用1-----Jackson常用注解介绍 eq:@JsonIgnore
循环引用:实体A与实体B有关系,A中有B作为字段,B中有A作为一个字段.查询A对象后,将A对象转化为JSON格式数据时,会因为序列化过程中导致A中有B字段,B字段中又有A,这样就引起了循环引用的问题! ...
- SpringJDBC解析3-回调函数(update为例)
PreparedStatementCallback作为一个接口,其中只有一个函数doInPrepatedStatement,这个函数是用于调用通用方法execute的时候无法处理的一些个性化处理方法, ...
- 技术:使用Amazon S3接口云存储(Java版)
http://blog.sina.com.cn/s/blog_6c7c14270102wait.html
- 项目新的需求,网页的自适应交付/响应式交付 Responsive/Adaptive Delivery
网页为什么要做自适应交付,皆因现在移动设备大行其道,现在是移动互联网时代,以IOS及Android为首的各种移动终端已经遍地开花. 当人家用380px的iphone打开你的网页时,你总不能显示个102 ...
- spring mvc 解决后台传递值乱码问题
在Web-xml 配置添加过滤器 <!-- 配置过滤器 解决乱码问题 --> <filter> <filter-name>CharacterEncodingFilt ...
- Robotium ant 报错Unable to find instrumentation info for: ComponentInfo{project/android.test.InstrumentationTestRunner}
[echo] Running tests ... [exec] INSTRUMENTATION_STATUS: id=ActivityManagerService [exec] INSTRUMENTA ...
- 书摘及理解:Servlet与JSP的关系
“Servlet是服务器端程序,它把应用逻辑嵌入到HTTP请求,在应答过程中可以直接通过PrinteWriter 输出经过逻辑处理后的动态HTML.JSP则是一种特殊的Servlet,它将Java代码 ...
- UpdatePanel的使用
一.UpdatePanel的结构 <asp:ScriptManager ID="ScriptManager1" runat="server" > & ...
- WPF学习笔记(3):Path绘制命令zz
WPF的XAML提供了一系列功能强大.用法复杂的 mini-language 来描述可扩展应用程序标记语言 (XAML) 中的几何路径.如下所示: XAML <Canvas> < ...