将文本的内容复制到剪切板,ZeroClipboard

昨天做一个自认为很简单的效果....一个input,一个按钮,点击按钮将文本复制到剪切板上...(以前不是经常用吗,好像很简单的样子.)

然后昨天捣鼓了一个小时才搞定...这里记一下,以后说不定用得着..

只能说浏览器的兼容是一个大坑...

正题吧....

ie浏览器好像有自己的一个唯一方式..似乎所有其他浏览器都不兼容...也就是 window.clipBoardData.setData

 所以逼于无奈...选择用插件..ZeroClipboard..

首先下载两个文件1. jquery.zclip.min.js  2.ZeroClipboard.swf (3.jquery-1.11.1.min.js )

第三个是jQuery的js.有的话就不用下

引入相关的js

<script src="js/jquery-1.11.1.min.js" type="text/javascript"></script>
<script type="text/javascript" src="js/jquery.zclip.min.js"></script>

页面是这个样子滴...

<input type="text" class="tjm_inputtext" value="我是要复制的内容" id="code" /> <input type="button" title="复 制" value="复 制" class="tjm_btn" id="copy" />

然后js是这个样子滴.

$(function(){
 	$('#copy').zclip({
 		path: 'js/ZeroClipboard.swf',
 		copy: function(){
 			return $('#code').val();
 		},
 		afterCopy: function(){
 			alert("已经复制了哟.");
 		}
 	});
});

其中ZeroClipboard.swf若不在当前目录下的话,需要指定路径.

这这样就可以复制到剪切板了....好像很简单..弄了我一个多小时..哎...

这个也可以在本地跑哦..(ps:网上直接用js的不能在本地跑的样子...必须服务器环境)