常规利用JS编写的网页复制功能只对IE有效,无法做到兼容其它浏览器,代码如下:

function copyToClipBoard(){
var clipBoardContent="";
clipBoardContent+=document.getElementById("giftNumber").value; //可以是任何html ElementId,自己设置
if(window.clipboardData){
window.clipboardData.clearData();
window.clipboardData.setData("Text", clipBoardContent);
alert("已成功复制!");
}else if(navigator.userAgent.indexOf("Opera") != -1){
window.location = clipBoardContent;
alert("复制失败"); //链接跳转
}else if (window.netscape){
try{
netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
}catch (e){
alert("您的当前浏览器设置已关闭此功能!请按以下步骤开启此功能!\n新开一个浏览器,在浏览器地址栏输入'about:config'并回车。\n然后找到'signed.applets.codebase_principal_support'项,双击后设置为'true'。\n声明:本功能不会危极您计算机或数据的安全!");
}
var clip = Components.classes['@mozilla.org/widget/clipboard;1'].createInstance(Components.interfaces.nsIClipboard);
if (!clip) return;
var trans = Components.classes['@mozilla.org/widget/transferable;1'].createInstance(Components.interfaces.nsITransferable);
if (!trans) return;
trans.addDataFlavor('text/unicode');
var str = new Object();
var len = new Object();
var str = Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);
var copytext = clipBoardContent;
str.data = copytext;
trans.setTransferData("text/unicode",str,copytext.length*2);
var clipid = Components.interfaces.nsIClipboard;
if (!clip) return false;
clip.setData(trans,null,clipid.kGlobalClipboard);
}else if(navigator.userAgent.indexOf("Safari") != -1){
$("#copyTip").html("您使用的浏览器不支持复制功能,请使用右键复制").show();
//alert("您使用的浏览器不支持复制功能,请使用右键复制")
}
}

ZeroClipboard是利用flash为媒介实现兼容各浏览器复制功能一款jquery插件(测试通过浏览器IE6-8/chrome27/firefox22/safari 5.1.5/opera12.12),通过简单的调用实现复制功能:

$(document).ready(function() {
var clip = new ZeroClipboard($("#d_clip_button"), {
moviePath: "ZeroClipboard.swf"
}); clip.on('load', function (client) {
debugstr("Flash movie loaded and ready.");
}); clip.on('noFlash', function (client) {
$(".demo-area").hide();
debugstr("Your browser has no 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) {
debugstr("Copied text to clipboard: " + args.text);
}); // jquery stuff (optional)
function debugstr(text) {
$("#d_debug").append($("<p>").text(text));
} });

demo下载

注意:

1、需以web形式访问才有效。

2、IE下复制按钮为可点击的那层DOM最后一级(不是最后一级有时会出问题,如把b换成span在IE下无效)
<button id="copyBtn" class="my_clip_button" title="Click me to copy to clipboard." data-clipboard-target="giftNumber" data-clipboard-text="Default clipboard text from attribute"><b>Copy To Clipboard...</b></button>

参考资料:

http://jonrohan.github.io/ZeroClipboard/
https://github.com/zeroclipboard/ZeroClipboard
http://js8.in/407.html

ZeroClipboard插件:兼容各浏览器网页复制功能的更多相关文章

  1. 图片旋转+剪裁js插件(兼容各浏览器) « 张鑫旭-鑫空间-鑫生活

    图片旋转+剪裁js插件(兼容各浏览器) « 张鑫旭-鑫空间-鑫生活 图片旋转+剪裁js插件(兼容各浏览器) by zhangxinxu from http://www.zhangxinxu.com 本 ...

  2. js兼容各个浏览器的复制功能

    看似简单的复制功能,用js做起来竟然遇到各种情况.刚开始在网上搜索到复制功能的几种实现方法,但是都不兼容.最后还是用的插件代码如下 html模板 <tr> <td>1</ ...

  3. ZeroClipboard.js兼容各种浏览器复制到剪切板上

    http://www.cnblogs.com/huijieoo/articles/5569990.html <script type="text/javascript" sr ...

  4. 兼容多浏览器的网页复制插件(ZeroClipboard)

    前言: 常规利用JS编写的网页复制功能是最简单的方法,但是只对IE有效,无法做到兼容其它浏览器,对其他浏览器也就只能弹窗提示用户手动复制了. <script type="text/ja ...

  5. 兼容各个浏览器的jquyer zclip复制文本插件 无效的解决办法

    项目中使用点击文本复制功能,用了这个兼容各个浏览器的插件,但是发现放在最前面正常,放到嵌套的html中就失效. 解决办法: <span style="position: relativ ...

  6. 一个实现浏览器网页与本地程序之间进行双向调用的轻量级、强兼容、可扩展的插件开发平台—PluginOK中间件

    通过PluginOK中间件插件平台(原名本网通WebRunLocal)可实现在网页中的JavaScript脚本无障碍访问本地电脑的硬件.调用本地系统的API及相关组件,同时可彻底解决ActiveX组件 ...

  7. [转载]html5直接在网页上播放视频音频兼容所有浏览器

    文章给大家分享一个html5直接在网页上播放视频兼容所有浏览器,有需要的同学可参考. HTML5可以用video标签来播放视频 当前,video 元素支持三种视频格式: 格式 IE Firefox O ...

  8. uploadPreview 兼容多浏览器图片上传及预览插件使用

    uploadPreview兼容多浏览器图片上传及预览插件 http://www.jq22.com/jquery-info2757 Html 代码 <div class="form-gr ...

  9. chorme插件 ,在浏览器上模拟手机,pad 查看网页|前端技术开发必备插件

    网址:http://lab.maltewassermann.com/viewport-resizer/使用方法:1在chrome浏览器上方右击,显示书签栏 2 打开插件网址,将<ignore_j ...

随机推荐

  1. HDOJ 5088 Revenge of Nim II 位运算

    位运算.. .. Revenge of Nim II Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Ja ...

  2. C# - 使用皮肤

    运行效果: 项目目录结构: 主窗体代码: using System; using System.Collections.Generic; using System.ComponentModel; us ...

  3. javascript笔记整理(流程控制)

    流程:就是程序代码的执行顺序 流程控制:通过规定的语句让程序代码有条件的按照一定的方式执行 1.顺序结构(按照书写顺序来执行,是程序中最基本的流程结构) 2.选择结构(分支结构.条件结构):根据给定的 ...

  4. 终于懂了:FWinControls子控件的显示是由Windows来管理,而不是由Delphi来管理(显示透明会导致计算无效区域的方式有所不同——透明的话应减少剪裁区域,所以要进行仔细计算)

    在研究TCustomControl的显示过程中,怎么样都找不到刷新FWinControls并重新显示的代码: procedure TWinControl.PaintHandler(var Messag ...

  5. boost操作xml 5分钟官方教程

    Five Minute Tutorial This tutorial uses XML. Note that the library is not specifically bound to XML, ...

  6. __autoload()方法

    php中__autoload()方法详解 PHP在魔术函数__autoload()方法出现以前,如果你要在一个程序文件中实例化100个对象,那么你必须用include或者require包含进来100个 ...

  7. const与define的使用区别

    1.const用于类成员变量定义,一旦定义且不能改变其值.define定义全局常量,在任何地方都可以访问. 2.define不能在类中定义而const可以. 3.const不能在条件语句中定义常量 i ...

  8. POJ 1042 Gone Fishing (贪心)(刘汝佳黑书)

    Gone Fishing Time Limit: 2000MS   Memory Limit: 32768K Total Submissions: 30281   Accepted: 9124 Des ...

  9. delphi中左右翻转窗体(修改EXStyle)

    unit Unit1; interface uses  Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Form ...

  10. Linux环境下使用eclipse开发C++动态链接库程序

    Linux中也有类似windows中DLL的变成方法,只不过名称不同而已.在Linux中,动态链接叫做Standard Object,生成的动态链接文件为*.so.详细请参考相关文档. 开发环境:Ec ...