javascript copy 复制

在IE下，可以使用clipboardData

 

<input type="button" name="anniu1" onClick='copyToClipBoard()' value="复制地址"> 
<script language="javascript"> 
   function copyToClipBoard(){ 
    var clipBoardContent=""; 
    clipBoardContent+=document.title; 
    clipBoardContent+=""; 
    clipBoardContent+=this.location.href; 
    window.clipboardData.setData("Text",clipBoardContent); 
    alert("复制成功！"); 
} 

 但是在FireFox却不行，http://davidwalsh.name/clipboard 提供了一种万能方案，傅用的是flash技术，我的代码如下

 

$(document).ready(function(){
		ZeroClipboard.setMoviePath('js/ZeroClipboard.swf');
		//create client
		var clip = new ZeroClipboard.Client();
		//event
		clip.addEventListener('mousedown',function() {
			clip.setText($('#inviteLink').val());
		});
		clip.addEventListener('complete',function(client,text) {
			alert("生成的代码已经复制到粘贴板，你可以使用Ctrl+V 贴到需要的地方去了哦！");
		});
		clip.glue('copy');
});

 copy为页面元素的id

这样就可以了，在IE6,IE9, FireFox8.0, Chrome15.0.874.106, 可以正常运行

注：Iteye就是用的这种方法^_^

 

【增加】：

    flash技术使用的是事件机制，就是点击事件，它把点击区域与页面元素的区域重复，点击复制元素时，就触发flash的复制事件，

 

var style = this.div.style;
style.position = 'absolute';
style.left = '' + box.left + 'px';
style.top = '' + box.top + 'px';
style.width = '' + box.width + 'px';
style.height = '' + box.height + 'px';

 昨天使用了js进行动态加载内容，发现复制失效了，找了半天，终于发现是这个问题，我的解决方案是，动态加载内容后，重新绑定，这样就可以了

    增加：页面变化后，一般是通过Ajax改变了页面的内容，这时可以通过clip.reposition()重新绑定，也可能通过 clip.show()，这个方法也会调用clip.reposition();

    相关的文章：https://code.google.com/p/zeroclipboard/wiki/Instructions