本demo支持各种浏览器复制，亲测可用（IE8，IE9，IE10，火狐，谷歌）。

本demo中使用了ZeroClipboard（下载地址：https://github.com/zeroclipboard/zeroclipboard）。

本demo 必须在服务器环境下，浏览器直接打开无效。

本demo 需要引入3个文件：jquery.min.js、ZeroClipboard.min.js和ZeroClipboard.swf。

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>复制到剪切板demo</title>

<script type="text/javascript" src="/webtest/js/jquery.min.js"></script>

<script type="text/javascript" src="/webtest/js/ZeroClipboard.min.js"></script>

</head>

<body>

    <input type="button" value="复制当前页面url" class="my_copy" >

</body>

<script type="text/javascript">

$(function() {

    var url = window.location.href;

    try{//支持ZeroClipboard

        ZeroClipboard.config( { swfPath:  "/webtest/js/ZeroClipboard.swf" } );

        $(".my_copy").each(function(i) {

            var client = new ZeroClipboard($(this));

            client.on("copy", function (event) {

                  var clipboard = event.clipboardData;

                  clipboard.setData( "text/plain", url);

                  alert('当前页面链接已复制到剪贴板！');

                  // clipboard.setData( "text/html", "<b>Copy me!</b>" );

                  // clipboard.setData( "application/rtf", "{\\rtf1\\ansi\n{\\b Copy me!}}" );

                });

        });

    }catch(e){

        //不支持ZeroClipboard

        $(".my_copy").each(function(i) {

            $(this).on("click", function(){

                var res = window.clipboardData.setData("Text", encodeURI(url));

                if(res){

                    alert('收集链接已复制到剪贴板！');

                }

            });

        });

    }

})

</script>

</html>

【javascript】复制到剪贴板功能（支持目前各种浏览器）的更多相关文章

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

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

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

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

  3. 黄聪：JS实现复制到剪贴板功能，兼容所有浏览器（转）

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

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

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

  5. js实现复制到剪贴板功能，兼容所有浏览器

    http://www.cnblogs.com/PeunZhang/p/3324727.html https://github.com/zeroclipboard/ZeroClipboard 复制链接到 ...

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

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

  7. JQuery实现复制到剪贴板功能

    在网页中实现复制到剪贴板功能,有两种方法, 第1种方法:使用JavaScript自带的方法,但是这种方法只能在IE下使用. document.execCommand("Copy") ...

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

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

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

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

随机推荐

  1. 使用struts2标签<s:action无法显示引用页面问题

    使用过程中参考:http://www.cnblogs.com/lihuiyy/archive/2012/03/23/2411601.html 个人使用: 1.引用页面 <s:action nam ...

  2. UVA 658 It's not a Bug, it's a Feature!

    这个题目巧妙之处在于用二进制的每个位1,0分别表示bug的有无,以及实施补丁对相应bug的要求以及实施后的对bug的影响. 软件bug的状态:1表示相应bug仍然存在,0表示已经修复.这样可以将软件的 ...

  3. easyui源码翻译1.32--ValidateBox（验证框）

    前言 使用$.fn.validatebox.defaults重写默认值对象.下载该插件翻译源码 validatebox(验证框)的设计目的是为了验证输入的表单字段是否有效.如果用户输入了无效的值,它将 ...

  4. DHTMLX 前端框架 建立你的一个应用程序 教程(十)--保存表单中的数据

    保存表单中的数据 现在我们所要做的是 当用户点击提交按钮的时候  我们将表单中的数据进行保存操作. 我们可以使用dhtmlxDataProcessor. 来进行操作.它是一个数据组件,可以提供与服务器 ...

  5. 坑爹的UICollectionView

    最近用UICoolectionView的时候遇到一个很DT的问题,我往VC里加12个视图,结果显示成这样(右边是期待的样子):       研究了一下午,终于发现了问题: @interface FpL ...

  6. cocos2d-x 2.2 wp8 开发手记

    最近有朋友问我有没有搞过  wp8 的cocos2dx开发 回复:额,没有.(感觉超没面子对方是妹子 = = ) 本着帮妹子试试的态度  就开始了 今天工作 第一我印象中wp8 开发必须要用 vs20 ...

  7. BZOJ1334: [Baltic2008]Elect

    1334: [Baltic2008]Elect Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 386  Solved: 201[Submit][Sta ...

  8. Android开发视频学习（1）

    S01E02_搭建Android开发环境 设置ANDROID_SDK_HOME环境变量,用于指定Android模拟器的目录,官方文档没有说要设置. S01E03_Android创世纪 Android根 ...

  9. HashSet的实现原理

    HashSet定义 public class HashSet<E> extends AbstractSet<E> implements Set<E>, Clonea ...

  10. POJ 3013

    思路:ans = 每条边(u,v)*v的子树节点的w = 所有的dist[v]*w[v]之和; #include<iostream> #include<queue> #incl ...