`

复制内容到剪切板 zclip使用

 
阅读更多

 

   今天要做一个点击按钮复制内容到剪切板的功能，弄了半天终于弄出来了，共享给大家。

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8" import="java.util.Date"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>

</head>
<body>

   	<input name="myurl"   id="myurl" type="text" class="copy-tex" readonly="readonly" value="<%=new Date() %>"/>
   	<input  type="button" class="copy-btn" value="复制" id="copyBtn" onclick="setCopyLink()"/>

	<script type="text/javascript" src="${pageContext.request.contextPath}/script/jquery-1.7.2.min.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath}/script/ZeroClipboard/jquery.zclip.min.js"></script>
	<script>
	$(function(){
 
		//复制url
		var text=$("#myurl").val();
	    //引入 Zero Clipboard flash文件   
	    ZeroClipboard.setMoviePath( "${pageContext.request.contextPath}/script/ZeroClipboard/ZeroClipboard.swf" );   
	    //新建对象   
	    clip = new ZeroClipboard.Client();   
	    //设置指向光标为手型   
	    clip.setHandCursor( true );   
	    //通过传入的参数设置剪贴板内容   
	    clip.setText(text);   
	    //添加监听器，完成点击复制后弹出警告   
	    clip.addEventListener("complete", function (client, text) {   
	        alert("已经成功复制到剪帖板上");   
	    });    
	  //绑定触发对象按钮ID 
	     if (!!window.ActiveXObject){
	 	    	//alert('IE浏览器');
	 	    	var isIE=!!window.ActiveXObject;
	 	    	 isIE6=isIE&&!window.XMLHttpRequest;
	 	    	var isIE8=isIE&&!!document.documentMode;
	 	    	var isIE7=isIE&&!isIE6&&!isIE8;
	 	    	if (isIE6){
	 	    		//alert('ie6');
	 	    		}else if (isIE7){
	 	    		//alert('ie7');
	 	    	}else{
	 	    	 clip.glue("copyBtn");
	 	       } 
	     }else{
	     		 clip.glue("copyBtn");
	     		 //alert("火狐");
	     	}
 
	   
	});
	function setCopyLink(){
		var urlTxt=$("#myurl").val();
		copyToClipboard(urlTxt);
	}
	function copyToClipboard(txt) {
	    if (window.clipboardData) {
	        window.clipboardData.clearData();
	        window.clipboardData.setData("Text", txt);
	        alert("已经成功复制到剪帖板上！");
	    } else if (navigator.userAgent.indexOf("Opera") != -1) {
	        window.location = txt;
	    } else if (window.netscape) {
	        try {
	            netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
	        } catch (e) {
	            alert("被浏览器拒绝！\n请在浏览器地址栏输入'about:config'并回车\n然后将'signed.applets.codebase_principal_support'设置为'true'");
	        }
	        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 = Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);
	        var copytext = txt;
	        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);
	        alert("已经成功复制到剪帖板上！");
	    }
	}
	</script>						
						
</body>


</html>

 

分享到：
| Hadoop1.2.1elipse插件的安装
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    jquery复制到剪切板插件zclip

    `jQuery zclip`是一个实用的JavaScript插件，它允许用户通过简单的API将特定文本或内容复制到计算机的剪贴板。这个插件依赖于`ZeroClipboard`库，该库利用了Flash技术来实现跨浏览器的剪贴板交互。在介绍`jQuery ...

    JavaScript复制内容到剪切板示例

    JavaScript复制内容到剪切板示例, JavaScript复制内容到剪切板示例代码 JavaScript复制内容到剪切板示例简单小例子

    jquery复制内容到剪切板

    "jquery复制内容到剪切板"这个主题聚焦于如何利用jQuery实现网页上的文本复制功能，使得用户可以方便地将特定内容复制到他们的剪贴板中。在现代Web开发中，这种功能对于提升用户体验至关重要，特别是在需要用户频繁...

    详解微信小程序之一键复制到剪切板

    但是在一键复制的场景中，我们主要使用的是`wx.setClipboardData`来实现设置数据到剪切板的功能。 通过上述步骤和示例代码，开发者可以在微信小程序中实现一键复制到剪切板的功能，这在处理文本信息时尤其有用。...

    C# 复制图片 剪切板

    在本案例中，我们关注的是使用C#语言实现从网页中复制图片并将其存储到剪切板，以便用户可以方便地在不同应用程序之间进行粘贴，如微信或QQ。以下是对这个主题的详细讲解： 首先，我们需要理解剪切板是什么。剪切板...

    h5复制到剪切板兼容ios浏览器

    ios+android+h5复制剪切板

    兼容各浏览器的复制内容到剪切板

    【标题】：“兼容各浏览器的复制内容到剪切板” 【描述】：这篇博客主要探讨的是如何实现一个在各种浏览器中都能正常工作的复制内容到剪贴板的功能。在Web开发中，用户有时需要将网页上的信息复制到剪贴板，以便...

    jQuery-zclip实现复制内容到剪切板

    jQuery-zclip是一个复制内容到剪贴板的jQuery插件，使用它我们不用考虑不同浏览器和浏览器版本之间的兼容问题。jQuery-zclip插件需要Flash的支持，使用时记得安装Adobe Flash Player。

    复制文本到系统剪切板

    本程序为方便将文本复制到系统剪切板， 以便省去ctrl+c或者右键→复制的步骤 节省时间 联系作者：shaojimei@qq.com 将要复制的文本填入文本框，点击复制 按钮即可

    复制png图片到剪切板

    一般复制的是文件，这个是复制内容，复制的文件不能直接复制到剪切板，我这个可以

    JQUERY复制到剪切板

    clipboard.js 使用纯 JavaScript （无需 Flash）实现了复制浏览器内容到系统剪切板的功能，可以在浏览器和 Node 环境中使用。支持 Chrome 42+、Firefox 41+、IE 9+、Opera 29+。

    javascript复制到剪切板

    总的来说，JavaScript实现复制到剪切板的功能涉及到对`Clipboard API`的理解和使用，以及考虑到浏览器兼容性问题。随着浏览器对新API的支持度提高，使用`navigator.clipboard`将成为主流。然而，对于老版本浏览器，...

    qml图表和截图至剪切板

    在本文中，我们将深入探讨如何在Qt Quick QML中创建和操作图表，并实现将图表内容复制到剪切板的功能。QML（Qt Quick Markup Language）是Qt框架的一部分，用于构建用户界面，它允许开发者以声明式的方式定义UI元素...

    js clipboard 复制文字到剪切板功能

    JavaScript中的剪切板操作是Web开发中的一个常见需求，它允许用户方便地复制网页上的文本内容到系统剪切板，以便在其他地方粘贴。在本文中，我们将深入探讨如何实现"js clipboard 复制文字到剪切板功能"，并确保其在...

    C#获取剪切板内容

    本文将深入探讨如何使用C#获取剪切板内容，这在日常编程中是一个非常实用的功能，比如在实现复制、粘贴或者数据交换的场景下。 首先，我们需要了解Windows操作系统中的剪切板。剪切板是系统提供的一种临时存储数据...

    jquery插件czlip复制到剪切板

    **jQuery 插件 czlip：实现高效便捷的文本复制到剪切板功能** 在Web开发中，有时我们需要为用户提供方便快捷地将页面上的文本复制到剪切板的功能。`jQuery`是一个广泛使用的JavaScript库，它简化了DOM操作、事件...

    剪切板 网页操作

    这个API允许网页应用在用户许可的情况下读写剪切板内容，提高了用户体验，但考虑到隐私和安全，它的使用必须谨慎。 总结来说，剪切板在网页操作中起着桥梁作用，使得数据能在不同页面之间自由流动。C++和VC提供了...

    原生JavaScript复制内容到剪切板代码示例，无三方库引用

    原生JavaScript复制内容到剪切板代码示例，无三方库引用

    兼容浏览器的单击按钮复制到剪切板

    在网页开发中，实现“单击按钮复制到剪切板”的功能是一项常见的需求，尤其对于那些需要用户快速复制信息的场景。标题所提及的问题在于，这个功能在不同浏览器上可能存在兼容性问题，例如IE（Internet Explorer）...

Magicbox
Global site tag (gtag.js) - Google Analytics