复制功能,基本上支持IE/Firefox/Chrome等所有浏览器【Zeroclipboard.js使用教程】

先去ZeroClipboard官方下载代码包,官方地址是http://code.google.com/p/zeroclipboard/

1.0.7版本下载地址:http://zeroclipboard.googlecode.com/files/zeroclipboard-1.0.7.tar.gz

将其解压,得到ZeroClipboard.js和ZeroClipboard.swf

 

使用步骤:

1、先引入ZeroClipboard.js。

 

2、然后使用方法,在你的函数里面这样用:

 

ZeroClipboard.setMoviePath("这里填写ZeroClipboard.swf文件的路径");
var clip = new ZeroClipboard.Client(); // 新建一个对象
clip.setHandCursor(true); // 设置鼠标为手型
clip.setText("你需要复制copy的文本");
clip.glue("btnCopy"); //与复制按钮关联,这里的btnCopy是关联对象的id,必须和第3步中的html对象的id相同

//下面这些代码可选
clip.addEventListener( "load", function(client) {
   	client.movie.title="复制本文链接";
});

//鼠标移上时改变按钮的样式 
clip.addEventListener( "mouseOver", function(client) {
   	document.getElementById("btnCopy").style.cssText="color:#FF6600;";
}); 
//鼠标移除时改变按钮的样式
clip.addEventListener( "mouseOut", function(client) {    	
	document.getElementById("btnCopy").style.cssText=""; 
});

//这个是复制成功后的提示
clip.addEventListener( "complete", function(){
    alert("本文链接复制成功!"); 
});

 

3、在页面加入你的复制按钮,我这里使用的链接a标签,也可以是其他html对象

 

<a href="javascript:void(0);" id="btnCopy" title="复制本文链接">复制本文链接</a>

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值