JQuery实现复制到剪贴板功能
在网页中实现复制到剪贴板功能，有两种方法，
第1种方法：使用JavaScript自带的方法，但是这种方法只能在IE下使用。
document.execCommand("Copy"); // 执行浏览器复制命令
alert("已复制好，可贴粘。");
或者
window.clipboardData.setData("Text","要复制的内容");
alert("已复制好，可贴粘。"); 第2种方法：使用Jquery.ZeroClipboard组件，这种方法通过内嵌flash来实现的，可以兼容当前流行的各种浏览器。
我们今天主要讲解第2种方法的实现（该方法在本地测试好像不行，必须发布到服务器上才可以）
首先引用JQuery和Jquery.ZeroClipboard，其中包括一个swf文件。
下面是网页的源代码：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>JQuery实现复制到剪贴板功能</title>
<script type="text/javascript" src="JavaScript/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="JavaScript/ZeroClipboard.js"></script>
<script type="text/javascript">
$(function ()
{
//实现复制功能
$("#Copy").zclip({
path: 'JavaScript/ZeroClipboard.swf',
copy: $("#txtInput").val() + "\r\n" + "[转载自：IT交流吧(http://www.itc8.com)]",
afterCopy: function ()
{
alert("复制成功，您可以粘贴发送给QQ上的好友或QQ群了!");
}
});
});
</script>
</head> <body>
<input type="text" id="txtInput" />
<input type="button" id="Copy" value="复制" />
</body>
</html>
JQuery实现复制到剪贴板功能的更多相关文章
- js/jQuery实现复制到剪贴板功能，兼容所有浏览器
因为工作的原因,需要实现这样一个功能:点击按钮,复制文本内容. 百度了一下,大都语焉不详,最终找到了一篇很好的博文,有讲解,有实例,捣鼓了一会,最终实现了功能. 网址在这里http://www.cnb ...
- 【转】js实现复制到剪贴板功能，兼容所有浏览器
两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...
- 【原】js实现复制到剪贴板功能，兼容所有浏览器
两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...
- 黄聪：JS实现复制到剪贴板功能，兼容所有浏览器（转）
两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...
- Zero Clipboard - 跨浏览器兼容的“复制到剪贴板”功能
开发中经常会用到复制的功能,在 IE 下实现比较简单,但要想做到跨浏览器比较困难了. 本文将介绍一个跨浏览器的库类 Zero Clipboard ,它利用 Flash 进行复制,所以只要浏览器装有 F ...
- JS pc端和移动端共同实现复制到剪贴板功能实现
JS pc端和移动端实现复制到剪贴板功能实现 在网页上复制文本到剪切板,一般是使用JS+Flash结合的方法,网上有很多相关文章介绍.随着 HTML5 技术的发展,Flash 已经在很多场合不适用了, ...
- 兼容所有浏览器的JQuery zClip插件实现复制到剪贴板功能
相信这个功能大家平时上网经常能碰到,以前也没怎么留意怎么实现的,直到项目中需要. 网上一搜一大堆,单纯使用js方法也不是没有,但是由于各浏览器的安全机制不同,不是跨浏览器的.去看了几个常用的网站,都是 ...
- 【转载】兼容所有浏览器的JQuery zClip插件实现复制到剪贴板功能
文章转载自 代码家园 http://www.daimajiayuan.com/ 原文链接:http://www.daimajiayuan.com/sitejs-17973-1.html原文摘要: 相信 ...
- 【转】js插件zClip实现复制到剪贴板功能
相信这个功能大家平时上网经常能碰到,以前也没怎么留意怎么实现的,直到项目中需要. 网上一搜一大堆,单纯使用js方法也不是没有,但是由于各浏览器的安全机制不同,不是跨浏览器的.去看了几个常用的网站,都是 ...
随机推荐
- Java. How to use headless browsers for crawling web and scraping data from website.--转
https://www.linkedin.com/pulse/java-how-use-headless-browsers-crawling-web-scraping-data-taluyev/ Di ...
- sql语句优化：用join取代not in
不要太多使用not in查询,最好用表连接来取代它.如: select ID,name from Table_A where ID not in (select ID from Table_B) 这句 ...
- 实现一个类似于收趣APP的功能
近日想做一个类似于收趣APP软件的一个功能,将头条.微信等其他App的文章能够通过分享微信好友的方式分享到自己的平台软件中. 分享的方式有三种: 1.通过微信好友的方式,将文章分享给收趣. 2.复制文 ...
- Gradle的属性Property设置与调用
Gradle在默认情况下已经为Project定义了很多Property: project:Project本身 name:Project的名字 path:Project的绝对路径 description ...
- PHP开发之旅-验证码功能实现
验证码这样的功能可以说是无处不在了,接下来使用php来实现验证码这样的功能,这里我是将验证码实现抽取到一个类中独立开来,那么后面如果再使用到验证码功能,直接引入该类文件并创建该类的实例,就可以使用验证 ...
- .net 大数据量，查找Where优化（List的Contains与Dictionary的ContainsKey的比较）
最近优化一个where查询条件,查询时间很慢,改为用Dictionary就很快了. 一.样例 假设:listPicsTemp 有100w条数据,pictures有1000w条数据. 使用第1段代码执 ...
- jQuery——节点操作
创建节点 1.$():创建一个li标签 $("<li class='aaa'>我是li标签</li>") 2.html():创建一个li标签并同时添加到ul ...
- CSS——dispaly、overflow、visibility、opacity
隐藏盒子: 1.overflow:hidden; 隐藏盒子超出的部分. 2.display: none; 隐藏盒子,而且不占位置.(用的最 ...
- HDU_1160_FatMouse's Speed_dp
FatMouse's Speed Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) ...
- windows程序设为开机自启动
在Windows文件管理器中输入 %APPDATA%\Microsoft\Windows\Start Menu\Programs\Startup 把程序快捷方式放到此处即可.