jQuery ZeroClipboard粘贴板

【Javascript】

下载

新闻

文章

网页中偶尔需要复制链接到粘贴板里，常常做的是js版本，但无法兼容，今天介绍一个兼容比较好的jQuery ZeroClipboard粘贴板。

网页中偶尔需要复制链接到粘贴板里，然后粘贴分享。为了用户体验都不好意思对客户说“请使用右键复制粘贴”，都需要给一个按钮点一下就复制了内容。此做法常常用到的就是execCommand("Copy")。可惜只IE支持，但无法兼容。今天介绍一款FLASH粘贴板，兼容所有浏览器，但必须得安装了FLASH插件哦。

jQuery ZeroClipboard v1.1.1
官网：http://steamdev.com/zclip 全英文哦，英语要是好点就直接进去看看

事先请准备三个文件：
1、jquery.js
2、jquery.zclip.js ~16KB 源始版或者下载压缩版jquery.zclip.min.js ~7KB
3、ZeroClipboard.swf ~1KB

使用例子：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<title>jquery.zclip</title>	
<script type="text/javascript" src="jquery1.4.2.js"></script>
<script type="text/javascript" src="jquery.zclip.js"></script>
<body><input type="text" name="text" id="text" value="http://www.baidu.com" />
<a href="javascript:void(0)" id="dynamic">复制</a>

<script type="text/javascript">
$(document).ready(function(){
    $("#dynamic").zclip({
        path:'ZeroClipboard.swf',
        copy:$('#text').text()
});
</script>
</body>
</html>

文件打包下载：点击下载

使用注意：我们曾做一个案例时，发觉只有第一次复制有效，之后就无法复制。原来是我们多次运行$(id).zclip();造成的，也就是说针对同一个id你只能执行一次$(id).zclip()，假如你非要执行第二次，请你删除这个id再建一个相同的id来执行$(id).zclip()。

其他参数设置：

Settings
Variable	Default Value	Available Values
path *	"ZeroClipboard.swf"	"path/to/ZeroClipboard.swf"
copy *	null	any string, or any javascript expression or function that returns a string
afterCopy	null	specify a function to call after text is copied. (your afterCopy function will overwrite the default alert box.)
beforeCopy	null	specify a function to call before text is copied.
clickAfter	true	true false
setHandCursor	true	true false
setCSSEffects	true	true false
* required