`

复制内容到剪切板 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>

 

分享到:
评论

相关推荐

    jquery复制到剪切板插件zclip

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

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

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

    jquery-zclip:一个复制内容到剪贴板的jQuery插件

    复制页面内容到剪贴板兼容各浏览器 ##引用方式 require('jquery-zclip'); ##使用方法 $('#copy_input').zclip({ path: __uri('../../components/jquery-zclip/ZeroClipboard.swf'), copy: function(){//复制内容...

    jQuery zclip插件实现跨浏览器复制功能

    jQuery zclip插件是一个基于jQuery的工具,它能够帮助开发者在不同的浏览器中实现复制文本到剪切板的功能。这项技术在Web开发中尤其有用,因为直到最近,许多浏览器都还没有提供一个简单的方式来实现这一功能,尤其...

    兼容所有浏览器的点击复制功能(请在服务器上测试)

    描述中提到的"jquery+flash实现点击复制到剪切板"是指使用jQuery库来处理DOM元素和事件,同时利用Flash技术作为跨浏览器的剪贴板交互手段。这是因为Flash在早期浏览器中广泛支持,能够提供跨平台的剪贴板API。然而,...

    jQuery实现复制到粘贴板功能

    jQuery实现复制到粘贴板的功能主要依赖于第三方插件ZeroClipboard。这个插件利用了Flash技术,因为Flash具备与系统剪贴板交互的能力,而JavaScript本身由于安全限制无法直接操作剪贴板。以下将详细介绍如何使用...

Global site tag (gtag.js) - Google Analytics