在网页中实现复制到剪贴板功能,有两种方法,
第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实现复制到剪贴板功能的更多相关文章

  1. js/jQuery实现复制到剪贴板功能,兼容所有浏览器

    因为工作的原因,需要实现这样一个功能:点击按钮,复制文本内容. 百度了一下,大都语焉不详,最终找到了一篇很好的博文,有讲解,有实例,捣鼓了一会,最终实现了功能. 网址在这里http://www.cnb ...

  2. 【转】js实现复制到剪贴板功能,兼容所有浏览器

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  3. 【原】js实现复制到剪贴板功能,兼容所有浏览器

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  4. 黄聪:JS实现复制到剪贴板功能,兼容所有浏览器(转)

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  5. Zero Clipboard - 跨浏览器兼容的“复制到剪贴板”功能

    开发中经常会用到复制的功能,在 IE 下实现比较简单,但要想做到跨浏览器比较困难了. 本文将介绍一个跨浏览器的库类 Zero Clipboard ,它利用 Flash 进行复制,所以只要浏览器装有 F ...

  6. JS pc端和移动端共同实现复制到剪贴板功能实现

    JS pc端和移动端实现复制到剪贴板功能实现 在网页上复制文本到剪切板,一般是使用JS+Flash结合的方法,网上有很多相关文章介绍.随着 HTML5 技术的发展,Flash 已经在很多场合不适用了, ...

  7. 兼容所有浏览器的JQuery zClip插件实现复制到剪贴板功能

    相信这个功能大家平时上网经常能碰到,以前也没怎么留意怎么实现的,直到项目中需要. 网上一搜一大堆,单纯使用js方法也不是没有,但是由于各浏览器的安全机制不同,不是跨浏览器的.去看了几个常用的网站,都是 ...

  8. 【转载】兼容所有浏览器的JQuery zClip插件实现复制到剪贴板功能

    文章转载自 代码家园 http://www.daimajiayuan.com/ 原文链接:http://www.daimajiayuan.com/sitejs-17973-1.html原文摘要: 相信 ...

  9. 【转】js插件zClip实现复制到剪贴板功能

    相信这个功能大家平时上网经常能碰到,以前也没怎么留意怎么实现的,直到项目中需要. 网上一搜一大堆,单纯使用js方法也不是没有,但是由于各浏览器的安全机制不同,不是跨浏览器的.去看了几个常用的网站,都是 ...

随机推荐

  1. Django用户认证系统

    一. 认证系统概要 create_user 创建用户 authenticate 验证登录 login 记住用户的登录状态 logout 退出登录 is_authenticated 判断用户是否登录 l ...

  2. 初学者Android studio安装

    学习过java基础,最近趁着大量课余时间想学习Android开发.百度很多资料Android studio,由Google开发的开发工具,那就不需要再多说.对于初学者的我来说,一定足够用了.此文主要介 ...

  3. 我的 Windows 10 的基本配置

    Windows 10 的基本配置 功能性 开启 .Net Framework 3.5(包括 .NET 2.0 和 3.0) 旧版本 Windows 10 默认只安装了 .Net Framework 4 ...

  4. HDU_2212_水

    DFS Time Limit: 5000/2000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Submiss ...

  5. Python 之selenium+phantomJS斗鱼抓取案例

    from selenium import webdriver from bs4 import BeautifulSoup import time if __name__ == '__main__': ...

  6. 发布自己的nuget包

    1.先到www.nuget.org注册账户,然后在用户中心获取apikey 2.到https://dist.nuget.org/index.html下载最新的nuget.exe,放到你的项目根目录下 ...

  7. 移动端rem布局 js

    // rem布局适配 (function(doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in ...

  8. 安卓手机安装charles安全证书

    本次安装使用小米mix2为例. 手机浏览器上安装: 第一种: 1.首先 设置好手机的charles代理   172.16.xxx.xxx   8888 2.要使用 打开非自带浏览器(夸克/QQ/UC手 ...

  9. SqlServer Function

    set quoted_identifier on; set ansi_nulls on; go create function [dbo].[Get_StrArrayStrOfIndex] ( @st ...

  10. [SQL Service]从一张表取值更新另一张表字段

    1. update table_A set  table_A_column = ab.column from table_A aa left join table_B ab on aa.xx = ab ...