jquery zclip 复制黏贴功能不能实现
按照http://www.steamdev.com/zclip/我实现一个简单的zclip test
以下是我的测试code:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test jquery</title>
<script type="text/javascript" src="/kk/script/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="/kk/script/jquery.zclip.min.js"></script>
<script type="text/javascript">
$(function($){
$('#clip_order_id').zclip({
path:'/kk/script/ZeroClipboard.swf',
copy:$('#value_order_id').text(),
beforeCopy:function(){
$(this).css('color','#c0c0c0');
},
afterCopy:function(){
$(this).css('color','green');
}
});
});
</script>
</head>
<body>
<ul class="order_info_list">
<li class="info_label">orderId</li>
<li id="value_order_id">201354</li>
<li><input type="button" class="button_copy" id="clip_order_id" value="copy"></li>
</ul>
</body>
</html>
但它不能实现预期的效果。分析原因有两个：
1》ZeroClipboard.swf有问题，需要重新下载一个。
2》但是我放入复杂的框架里，它不能实现相应效果。检查我发现它的位置有问题：就是说我所点击的按钮和zclip的位置并不重合，所以没有起作用。
<div class="zclip" id="zclip-ZeroClipboardMovie_1" style="position: absolute; left: 48px; top: 56px; width: 44px; height: 22px; z-index: 99;"><embed id="ZeroClipboardMovie_1" src="/kk/script/ZeroClipboard10.swf" loop="false" menu="false" quality="best" bgcolor="#ffffff" width="44" height="22" name="ZeroClipboardMovie_1" align="middle" allowscriptaccess="always" allowfullscreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="id=1&width=44&height=22" wmode="transparent"></div>
详细修改可以参照：http://cheny.sh.blog.163.com/blog/static/49675535201305111141867/
jquery zclip 复制黏贴功能不能实现的更多相关文章
- jquery.zclip—复制剪贴板（兼容各大浏览器）
开始前说两句 WEB开发中,要让用户复制页面中的一段代码.URL地址等信息,为了避免用户拖动鼠标再进行右键复制操作而可能出现的差错,我们可以直接在页面中放置一个复制按钮,只需要轻轻一点这个复制按钮,内 ...
- jquery.zclip.js粘贴功能
jquery的粘贴插件: 如下是代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> ...
- jquery ZeroClipboard实现黏贴板功能，兼容所有浏览器
两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...
- 兼容所有浏览器的JQuery zClip插件实现复制到剪贴板功能
相信这个功能大家平时上网经常能碰到,以前也没怎么留意怎么实现的,直到项目中需要. 网上一搜一大堆,单纯使用js方法也不是没有,但是由于各浏览器的安全机制不同,不是跨浏览器的.去看了几个常用的网站,都是 ...
- js/jQuery实现复制到剪贴板功能，兼容所有浏览器
因为工作的原因,需要实现这样一个功能:点击按钮,复制文本内容. 百度了一下,大都语焉不详,最终找到了一篇很好的博文,有讲解,有实例,捣鼓了一会,最终实现了功能. 网址在这里http://www.cnb ...
- JQuery实现复制到剪贴板功能
在网页中实现复制到剪贴板功能,有两种方法, 第1种方法:使用JavaScript自带的方法,但是这种方法只能在IE下使用. document.execCommand("Copy") ...
- jquery.zclip轻量级复制失效问题
工作原理 利用一个透明的 Flash ,让其漂浮在按钮之上,这样其实点击的不是按钮而是 Flash ,也就可以使用 Flash 的复制功能了 <script src="js/jquer ...
- ZeroClipboard / jquery.zclip.min.js跨浏览器复制插件使用中遇到的问题解决
之前写过一个淘宝优惠券连接PC端转手机端连接的小工具,当时写到将转换好的url复制到剪切板这块时解决了IE和火狐,就是没办法搞定Chrome,知道可以通过flash搞定,但是觉得太麻烦没有仔细研究. ...
- 解决jquery.zclip.js插件无法复制的问题
网页中需要用到点击复制,在使用webpack加载jquery以及jquery.zclip.js后,出现了以下情况: jquery顺利加载 zclip插件顺利加载 ZeroClipboard.swf顺利 ...
随机推荐
- laypage分页功能demo
demo代码如下: <div id="view1"></div> <div id="page1"></div> ...
- ASP.Net Chart Control -----Bar and Column Charts
StackedBar StackedColumn StackedArea <asp:CHART id="Chart1" runat="server" H ...
- Redhat6.x下如何进行远程安装虚拟机
远程主机IP:192.168.122.1 远程主机名:server1.example.com 本地主机IP:192.168.122.2 本地主机名:server2.example.com 1.登录到远 ...
- Xcode6中segue取消原push与modal(deprecated)
xcode6 之后push 和modal 就被废弃了.只能用于ios8之前.在拖线的时候我们就可以看见. 这两个方法被废弃了,我们需要找到合适的方法来代替,这时候我们发现 show 和Present ...
- C++本质：类的赋值运算符=的重载，以及深拷贝和浅拷贝
关键词:构造函数,浅拷贝,深拷贝,堆栈(stack),堆heap,赋值运算符摘要: 在面向对象程序设计中,对象间的相互拷贝和赋值是经常进行的操作. 如果对象在申明的同时马上进行的初始化操作 ...
- DOM 之 SAX操作
SAX采用部分读取的方式,可以进行大型文件的处理,而且只需要从文件中读取特定的内容,SAX解析可以由用户自己建立对象模型.
- 【转发】centos 7安装完后出现please make your choice from '1' ......
PS:出现以上信息,是要求你阅读或者接收协议: Initial setup of CentOS Linux 7 (core)解决步骤如下: 1,输入[1],按Enter键阅读许可协议,2,输入[2], ...
- c#读取文本文档实践3-写入到文本本文档
首先通过File.ReadAllLines()方法读入文本文档中内容并返回字符串数组contents,这样每行数据就成为了这个字符串数组contents的一个元素,再利用split()方法将每一个元素 ...
- PHP同一个IP绑定多个域名（六）
原理图 一个ip绑定如何绑定多个域名? 解决方案: A.方案一:端口号来区别不同的站点 1.绑定一个网站 1.1先开发好自己的网站 d:/ApacheProject/myanimal 1.2 配置我们 ...
- html5 placeholder
placeholder是html5<input>标签的一个属性,placeholder 属性提供可描述输入字段预期值的提示信息(hint).该提示会在输入字段为空时显示,并会在字段获得焦点 ...