`
西北小强
  • 浏览: 343968 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

ZeroClipboard.js实现js复制功能

阅读更多

注意:此处需要使用的ZeroClipboard.js版本为1.0.7,附件中有所需js文件,如果js版本不对这个demo可能不好使

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<HTML>
 <HEAD>
  <TITLE> 复制demo </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
 </HEAD>
 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript"src="ZeroClipboard.js" ></script>

 <BODY>
	<INPUT TYPE="text" NAME="" id="txt" value="复制的内容">
  <input type="button" value="复制" id="BTNcOPY_1" />
 </BODY>
 <script type="text/javascript">
 	$(function(){
		$("input[id^=BTNcOPY_]").each(function(){
			//ZeroClipboard.swf和ZeroClipboard.js不在相同目录下需要设置动画文件路径
			//ZeroClipboard.setMoviePath("${base}/web/js/zeroclipboard-1.0.7/ZeroClipboard.swf");
			
			var clip = new ZeroClipboard.Client(); 	
			clip.setHandCursor(true); 
			var obj = $(this);
	        var id = $(this).attr("id");
			clip.glue(id);
			
			//鼠标移上时改变按钮的样式   
			clip.addEventListener( "mouseOver", function(client) {  
			    obj.css("color","#FF6600"); 
			    var txt=$("#txt").val();//设置复制内容
			    clip.setText(txt);  
			});   
			//鼠标移除时改变按钮的样式  
			clip.addEventListener( "mouseOut", function(client) {         
			    obj.css("color","");   
			}); 
			//这个是复制成功后的提示  
			clip.addEventListener( "complete", function(){  
			    alert("已经复制到剪切板!");   
			}); 
		});
 		});
 </script>
</HTML>

 

 

分享到:
评论

相关推荐

    ZeroClipboard.js 复制到剪切板(保准好用)

    ZeroClipboard.js 是一个JavaScript库,它允许用户通过模拟Flash对象实现网页内容的复制到剪切板功能。在浏览器环境中,由于安全限制,JavaScript通常无法直接访问操作系统级别的剪切板,而ZeroClipboard.js巧妙地...

    ZeroClipboard.js ZeroClipBoard.swf

    ZeroClipboard.js ZeroClipBoard.swf下载

    zeroClipboard.js + swf 支持chrome

    针对这个问题,"zeroClipboard.js + swf 支持chrome" 提供了一种有效的解决方案,使得在Chrome和IE等不同浏览器上实现拷贝复制粘贴功能成为可能。 首先,我们来了解核心组件zeroClipboard.js。这是一款JavaScript库...

    zclip.js ZeroClipboard.swf 下载

    《zclip.js与ZeroClipboard.swf:实现网页文本复制功能》 在网页开发中,有时候我们需要为用户提供方便快捷地复制文本的功能,而zclip.js和ZeroClipboard.swf就是实现这一功能的强大工具。这两个组件结合使用,可以...

    ZeroClipboard.min.js

    ZeroClipboard.min.js跨浏览器完美复制,可以多版本多浏览器实现一键复制的功能

    ZeroClipboard js实现完美复制

    ZeroClipboard是一款JavaScript库,它允许用户通过“剪贴板”API在网页上实现文本的复制功能,从而提供一种跨浏览器的复制体验。这个库利用了Adobe Flash技术来绕过浏览器的安全限制,因为JavaScript通常不能直接...

    兼容各大浏览器的jquery zclip复制功能所需要的类库(jquery.zclip.min.js和zeroClipboard.swf)

    在IT行业中,jQuery ZClip是一个常用的JavaScript插件,它允许用户轻松实现网页中文本或HTML内容的复制到剪贴板的功能。这个插件是跨浏览器的,因此可以在各种主流浏览器上运行,包括Chrome、Firefox、Safari、Opera...

    ZeroClipboard实现js复制

    ZeroClipboard是一款JavaScript库,它允许网页开发者通过模拟浏览器的右键复制功能,实现在网页上复制文本到剪贴板的功能。这款库巧妙地利用了Flash技术来绕过浏览器的安全限制,因为JavaScript直接操作剪贴板在大...

    jquery.zclip.min和ZeroClipboard.swf、jquery-1.8.3.min

    在给定的标题和描述中提到的"jquery.zclip.min"和"ZeroClipboard.swf"是两个关键组件,它们共同实现了在网页上提供复制功能。 首先,我们来详细了解一下`jquery.zclip.min.js`。这个文件是ZeroClipboard的jQuery...

    ZeroClipboard(JS复制内容到粘贴板)

    ZeroClipboard利用了Flash技术来实现跨浏览器的剪贴板交互,因为JavaScript直接操作剪贴板的功能在某些浏览器中受到安全限制。 1. **JavaScript与剪贴板交互的限制** 在JavaScript中,直接操作剪贴板是受到浏览器...

    ZeroClipboard.js使用一个flash复制多个文本框

    ZeroClipboard.js是一个JavaScript库,专门用于实现网页中的复制粘贴功能。通过使用Adobe Flash作为桥梁,它可以提供一个直观的手型光标,提高用户体验。当用户与网页上的按钮互动时,这些按钮可以触发复制操作,将...

    ZeroClipboard-JS实现复制到剪贴板功能

    ZeroClipboard是一个流行的JavaScript库,它利用浏览器的Flash插件来实现跨浏览器的复制到剪贴板功能。本文将详细介绍如何使用ZeroClipboard库以及它的核心原理。 首先,让我们理解一下ZeroClipboard的工作机制。...

    ZeroClipboard.zip

    ZeroClipboard是一款开源JavaScript库,主要用于实现网页上的“复制到剪贴板”功能。这个库巧妙地利用了Flash技术,因为在HTML5之前,浏览器的安全限制不允许JavaScript直接操作剪贴板。尽管现代浏览器已经开始支持...

    JS实现点击复制功能(ZeroClipboard)

    ZeroClipboard是一个流行的JavaScript库,它利用浏览器的Flash插件来实现跨浏览器的剪贴板交互,允许用户通过简单的点击操作复制文本。以下我们将深入探讨如何使用ZeroClipboard库实现这一功能。 首先,我们需要...

    使用 ZeroClipboard 实现复制功能

    而“工具”标签表明ZeroClipboard是一个辅助开发的工具,可以帮助简化网页上的复制功能实现。 在实际使用中,开发者需要注意几个关键点: - **Flash安全策略**:由于使用Flash,需要确保Flash的跨域策略允许访问,...

    ZeroClipboard JS 复制剪切板

    总结来说,ZeroClipboard是一个方便的JavaScript库,通过Flash技术实现了跨浏览器的剪贴板复制功能。它简单易用,支持事件监听和自定义,对于那些需要在网页上提供复制功能的应用场景非常有用。通过以上步骤,你可以...

    ZeroClipboard 复制与粘贴

    ZeroClipboard 是一个JavaScript库,主要用于实现网页上的跨浏览器复制功能,尤其在处理用户希望复制文本到剪贴板的场景中非常实用。这个库巧妙地利用了Adobe Flash技术,因为Flash在浏览器中的广泛支持,可以绕过...

    ZeroClipboard实现兼容多浏览器复制

    标题中的“ZeroClipboard实现兼容多浏览器复制”是指一个JavaScript库,ZeroClipboard,它允许用户在网页上通过模拟鼠标右键点击复制文本到剪贴板,从而实现跨浏览器的复制功能。这个库尤其重要,因为浏览器的安全...

    ZeroClipboard实现各浏览器的复制功能

    2. `ZeroClipboard.js`:这是ZeroClipboard的JavaScript库文件,包含了实现复制功能的函数和方法,开发者可以通过在自己的JavaScript代码中引用这个文件来使用ZeroClipboard的功能。 3. `ZeroClipboard.swf`:这是...

Global site tag (gtag.js) - Google Analytics