代码下载地址:代码下载地址
在做项目时有一个需求,是需要复制内容到剪切板,在去网上查找之后,发现很多人发的代码或多或少都有一些小问题。
例如如下代码:
<script language="javascript">
function copy(){
window.clipboardData.setData('text',document.getElementById('text').value);
alert("复制成功!");
}
</script>
上面的代码是可以使用的,但是仅仅是在IE下使用的,那在Chrome下如何解决这个问题呢。
经过在网络的大量查找,找到一个比较好的解决办法,那就是使用ZeroClipboard.js和ZeroClipboard.swf。
下面就是使用它们所需要做的工作:
引入jquery.js和ZeroClipboard.js我们就不说了。
<script type="text/javascript">
// 设置SWF文件的路径
ZeroClipboard.setMoviePath("swf/ZeroClipboard.swf");
$(document).ready(function(){
$("button[id^=copy_]").each(function(){
// 创建ZeroClipboard对象
var clip = new ZeroClipboard.Client();
clip.setHandCursor(true);
var obj = $(this);
var id = $(this).attr("id");
// 要复制的内容
var content = $(this).attr("copyContent");
clip.setText(content);
clip.glue(id);
//这个是复制成功后的提示
clip.addEventListener( "complete", function(){
alert("已经复制到剪切板!"+"\n"+content);
});
});
});
</script>
这里需要注意的一点就是这个复制按钮的id不能相同,是需要类似于copy_1,copy_2,copy_3这样,
这个也是目前为止比较不爽的地方。
如果大家谁有更好的,请消息我~