兼容各种浏览器的一键复制--ZeroClipboard
2015-05-06 12:04
190 查看
网上一键复JS会有浏览器不兼容的问题。这里介绍的是一个js加flash的插件来处理的。网上也有有各种介绍,但感觉不完全。也不算原创吧,只是自己记录一下。以便自己以后使用。
我们直接看代码吧。
引入js文件
附件:http://down.51cto.com/data/2365652
我们直接看代码吧。
引入js文件
<script src="jquery-1.7.2.min.js"></script> <script src="ZeroClipboard.min.js"></script>body里面的内容
<div class="libao_code"> <input name="" type="text" class="txt" value="" id="cardno"/> <button id="d_clip_button" class="copy_btn" title="复制礼包码" data-clipboard-target="cardno" data-clipboard-text="Default clipboard text from attribute"><b>点击复制</b> </button> </div> <script type="text/javascript"> $(function() { //这里的ID是复制按钮的id var clip = new ZeroClipboard($("#d_clip_button"), { moviePath: "ZeroClipboard.swf" }); clip.on('noFlash', function(client) { $(".demo-area").hide(); debugstr("浏览器没有FLASH插件."); }); clip.on('wrongFlash', function(client, args) { $(".demo-area").hide(); debugstr("Flash 10.0.0+ is required but you are running Flash " + args.flashVersion.replace(/,/g, ".")); }); clip.on('complete', function(client, args) { alert("复制成功,您的礼包是: " + args.text); }); function debugstr(text) { //这里的ID是输入框的ID $("#cardno").append($("<p>").text(text)); } }); </script> </body>注意在复制按钮里有一个自定义属性
data-clipboard-target="cardno"这里也是填写要复制的目标ID,这里是输入框的ID
附件:http://down.51cto.com/data/2365652
相关文章推荐
- ZeroClipboard实现复制功能(兼容各浏览器终极解决办法)
- 兼容多浏览器的网页复制插件(ZeroClipboard)
- ZeroClipboard实现多个浏览器兼容的复制文本到剪贴板的功能
- ZeroClipboard 完美实现复制粘贴功能、跨浏览器兼容
- zeroclipboard兼容多浏览器复制到粘贴板功能
- ZeroClipboard 完美实现复制粘贴功能、跨浏览器兼容
- ZeroClipboard插件:兼容各浏览器网页复制功能
- ZeroClipboard.js兼容各种浏览器复制到剪切板上
- zclip ZeroClipboard 兼容各种浏览器的复制功能
- javascript 复制粘贴功能 各种浏览器兼容
- ZeroClipboard实现兼容各浏览器复制功能一款jquery插件
- ZeroClipboard实现多个浏览器兼容的复制文本到剪贴板的功能
- ZeroClipboard插件:兼容各浏览器网页复制功能
- ZeroClipboard实现兼容各浏览器复制功能一款jquery插件
- [置顶] ZeroClipboard实现复制功能,做到浏览器兼容
- 文本框复制代码,兼容大部分浏览器(ZeroClipboard插件、附件)
- angularjs-兼容各种浏览器的复制到剪切板功能的代码
- JS实现复制功能,兼容各大主流浏览器复制神器 ZeroClipboard
- Js 复制到剪贴板,兼容各浏览器 Zero Clipboard swf
- CSS 实现图片灰度效果 兼容各种浏览器