兼容所有浏览器的复制到剪切板功能，悬浮层不能复制问题解决-创新互联

浏览器复制其实是一个十分令人头疼的问题，因为这涉及到浏览器安全，所以浏览器本生不会提供相应接口，我们也没有办法通过纯js来实现这个功能，但是你会看到很多网站，如百度云盘他们却做到了这个功能，那究竟他们是如何实现的，今天就让我带你去看看他们的秘密。

成都创新互联公司专注于企业营销型网站、网站重做改版、大足网站定制设计、自适应品牌网站建设、成都h5网站建设、购物商城网站建设、集团公司官网建设、成都外贸网站建设、高端网站制作、响应式网页设计等建站业务，价格优惠性价比高，为大足等各大城市提供网站开发制作服务。

  首先这个功能对我是十分重要的，因为去转盘网的私密分享必须要具备这个功能，截图如下：

     

只要你点击点我复制按钮，网盘私密分享的密码就会自动的被复制到你的浏览器。其实这个功能本人最开始做的时候还是付出很多时间，因为他涉及到悬浮层的复制，问题的难度陡然增大许多，不过现在我还是愿意公开代码，希望大家喜欢。顺便我我指出其他几篇我写的博客代码，希望喜欢：

百度网盘爬虫

百度图片爬虫

ok搜搜爬虫源码

java分词算法

邀请好友注册

数据库自动备份

 好的，现在让我们言归正转，浏览器复制需要两个插件，请先下载：下载地址1 下载地址2

 代码如下：

        var clip=null;
	clip = new ZeroClipboard.Client();//new 一个对像
	clip.setText(null);
	ZeroClipboard.setMoviePath( '${pageContext.request.contextPath}/media/js/ZeroClipboard.swf');  //和html不在同一目录需设置setmoviepath
	//ZeroClipboard.setMoviePath( '../media/js/zeroclipboard10.swf');
	clip.setHandCursor(true);
	clip.addEventListener('mousedown', function(client) {
		
		window.passwd = document.getElementById("file-password").value;
		clip.setText(window.passwd);
	}); 
	
	clip.addEventListener('complete', function (client, text) {
	
	      window.url = document.getElementById("file-url").value;
	      var id=get_param("id");
	      var type=get_param("type");
	      window.open(window.url,'_self');
	      $('.theme-popover').hide();
	      $('.theme-popover-mask').hide();//将复制框dismiss
	      document.getElementById("theme-popover").style.visibility="hidden";//影藏
	      //记录下载信息
	      $.ajax({
	                  type: "post",
	                  url: "${pageContext.request.contextPath}/download/statistic.action", 
	                  dataType:"json",
	                  data:{
	                  		id:id,
	                  		type:type
	                  },
	                  success:function(data){;}     
	       });
	}); 
	clip.glue('copy-password','copy-dialog');

 代码中的记录下载信息等都是和去转盘网有关系，你不必关心，下面一句：

 document.getElementById("theme-popover").style.visibility="hidden";//影藏

非常重要，因为要悬浮层复制，如果是相对布局flash是找不见覆盖按钮的，所以开始的时候

document.getElementById("theme-popover").style.visibility="visible";//私密分享时显示

最后要影藏。

另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。

文章题目：兼容所有浏览器的复制到剪切板功能，悬浮层不能复制问题解决-创新互联
当前链接：http://6mz.cn/article/ccspgj.html