日期:2014-05-16  浏览次数:20378 次

javascript复制-支持firefox和IE

一、IE下面实现复制文本到剪贴板很简单,只需要一行代码:
window.clipboardData.setData("Text",varstring);

二、火狐下面就很麻烦了,目前常见的有2种方式:
第一种,比较少见,利用firefox的特性,但是需要用户手动去修改浏览器的设置,所以这种方法是下策,实现方式如下:
(参考http://www.iteye.com/topic/125198)
function copyToClipboard(txt) {  
      if(window.clipboardData) {   
              window.clipboardData.clearData();   
              window.clipboardData.setData("Text", txt);   
      } else if(navigator.userAgent.indexOf("Opera") != -1) {   
           window.location = txt;   
      } else if (window.netscape) {   
           try {   
                netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");   
           } catch (e) {   
                alert("被浏览器拒绝!\n请在浏览器地址栏输入'about:config'并回车\n然后将 'signed.applets.codebase_principal_support'设置为'true'");   
           }   
           var clip = Components.classes['@mozilla.org/widget/clipboard;1'].createInstance(Components.interfaces.nsIClipboard);   
           if (!clip)   
                return;   
           var trans = Components.classes['@mozilla.org/widget/transferable;1'].createInstance(Components.interfaces.nsITransferable);   
           if (!trans)   
                return;   
           trans.addDataFlavor('text/unicode');   
           var str = new Object();   
           var len = new Object();   
           var str = Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);   
           var copytext = txt;   
           str.data = copytext;   
           trans.setTransferData("text/unicode",str,copytext.length*2);   
           var clipid = Components.interfaces.nsIClipboard;   
           if (!clip)   
                return false;   
           clip.setData(trans,null,clipid.kGlobalClipboard);   
           alert("复制成功!")   
      }   
} 

第二种方法,利用flash的复制功能:
(参考http://www.lihaihong.com/article/77.html)
关键代码是:
<embed src="_clipboard.swf" FlashVars="clipboard='+encodeURIComponent(s)+'" width="0" height="0" type="application/x-shockwave-flash"></embed>

更新Flash 10后,禁止用户在没有点击flash的情况下复制内容,原来的方法失效了。解决方法是在按钮的上面覆盖一层透明的复制用的flash,或者直接使用一个用flash做的复制按钮。
function cpIt(theid){  
 	var s=document.getElementById(theid).value;
     if (window.clipboardData) {  
         window.clipboardData.setData("Text",s);  
     }  
     else  
     {    
         var flashcopier = 'flashcopier';  
         if(!document.getElementById(flashcopier)) {  
           var divholder = document.createElement('div');  
           divholder.id = flashcopier;  
           document.body.appendChild(divholder);  
         }  
         document.getElementById(flashcopier).innerHTML = '';  
         var divinfo = '<embed src="clipboard.swf" FlashVars="clipboard='+encodeURIComponent(s)+'" width="0" height="0" type="application/x-shockwave-flash"></embed>';  
         document.getElementById(flashcopier).innerHTML = divinfo;  
     }  
     alert("复制成功!");  
 }  

<input onclick="javascript:cpIt('huyu');" />