复制功能,基本上支持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>