2010年6月1日星期二

同时支持iexplorer和 firefox的javascript复制拷贝信息到剪贴板方法(转)

摘自：http://stephen830.javaeye.com/blog/258020

在WEB应用中,有时候会显示一些信息提供给客户进行拷贝,客户拷贝后就能粘贴到其他需要的位置,不需要客户手动的去选择信息然后在点复制。下面就提供一 段代码可以同时支持iexplorer和firefox的javascript拷贝到剪贴板功能。

功能会用到一个flash文件。（对应的文件 clipboard.swf 可以在附件的压缩包中找到）

目前的浏览器，基本上都装了flash的插件，因此基本上不会有什么影响。

Html 代码
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  2. <html><head><title>同时支持iexplore和firefox的javascript复制拷贝剪贴板方 法.txt</title>  
  3. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
  4. <script>  
  5. //copy信息到剪贴 板  
  6. function cpIt(s){  
  7.     if (window.clipboardData) {  
  8.         window.clipboardData.setData("Text",s);  
  9.     }  
  10.     else  
  11.     {    
  12.         var flashcopier = 'flashcopier';  
  13.         if(!document.getElementById(flashcopier)) {  
  14.           var divholder = document.createElement('div');  
  15.           divholder.id = flashcopier;  
  16.           document.body.appendChild(divholder);  
  17.         }  
  18.         document.getElementById(flashcopier).innerHTML = '';  
  19.         var divinfo = '<embed src="clipboard.swf" FlashVars="clipboard='+encodeURIComponent(s)+'" width="0" height="0" type="application/x-shockwave-flash"></embed>';  
  20.         document.getElementById(flashcopier).innerHTML = divinfo;  
  21.     }  
  22.     alert("\r \n信息："+s+"\r\n\r\n恭喜您，您需要的信息已经被成功复制到剪贴板了！\r\n\r\n贴心小提示：(1) 按 Ctrl+v 可以将上 面信息粘贴到您指定的位置。\r\n\r\n                        (2) 按空格键可迅速关闭本提示框");  
  23. }  
  24. </script>  
  25. </head><body>  
  26. <input type="text" name="idCopyText" id="idCopyText" value="要拷贝的文字..."><input type="button" value="拷贝到剪贴板" onclick="cpIt(document.getElementById('idCopyText').value);">  
  27. </body></html>  



附件：本文中使用的测试例子压缩包 example.zi
发帖者 时间：

没有评论:

发表评论

订阅： 博文评论 (Atom)