码迷,mamicode.com
首页 > Web开发 > 详细

js导出excel ()基于 OpenXML 支持 2007版本以上 浏览器 data 协议) 无须ie插件支持.

时间:2017-08-25 16:48:55      阅读:804      评论:0      收藏:0      [点我收藏+]

标签:enter   toe   com   display   nodetype   font   head   targe   element   

 方法一(推荐):

 基于微软OpenXML协议,支持excel2007版本以上.

基于浏览器 data 协议 ,

完全不需要依赖ie 插件.不需要客户端是否安装excel.

欢迎点评,共同进步 !


1
<html> 2 <head> 3 <meta http-equiv="content-Type" content="text/html;charset=utf-8"/> 4 <script type="text/javascript"> 5 function base64 (content) { 6 return window.btoa(unescape(encodeURIComponent(content))); 7 } 8 function exportOffice(tableID){ 9 var type = excel; 10 var table = document.getElementById(tableID); 11 var excelContent = table.innerHTML; 12 13 var excelFile = "<html xmlns:o=‘urn:schemas-microsoft-com:office:office‘ xmlns:x=‘urn:schemas-microsoft-com:office:"+type+"‘ xmlns=‘http://www.w3.org/TR/REC-html40‘>"; 14 15 excelFile += "<head>"; 16 excelFile += "<meta http-equiv=Content-Type; content=text/html;charset=UTF-8>"; 17 excelFile += "<!--[if gte mso 9]>"; 18 excelFile += "<xml>"; 19 excelFile += "<x:ExcelWorkbook>"; 20 excelFile += "<x:ExcelWorksheets>"; 21 excelFile += "<x:ExcelWorksheet>"; 22 excelFile += "<x:Name>"; 23 excelFile += "{worksheet}"; 24 excelFile += "</x:Name>"; 25 excelFile += "<x:WorksheetOptions>"; 26 excelFile += "<x:DisplayGridlines/>"; 27 excelFile += "</x:WorksheetOptions>"; 28 excelFile += "</x:ExcelWorksheet>"; 29 excelFile += "</x:ExcelWorksheets>"; 30 excelFile += "</x:ExcelWorkbook>"; 31 excelFile += "</xml>"; 32 excelFile += "<![endif]-->"; 33 excelFile += "</head>"; 34 excelFile += "<body><table>"; 35 excelFile += excelContent; 36 excelFile += "</table></body>"; 37 excelFile += "</html>"; 38 var base64data = "base64," + base64(excelFile); 39 switch(type){ 40 case excel: 41 window.location.href=data:application/vnd.ms-+type+;+base64data; 42 break; 43 case powerpoint: 44 window.open(data:application/vnd.ms-+type+;+base64data); 45 break; 46 } 47 } 48 </script> 49 50 </head> 51 <body> 52 <table id="targetTable"> 53 <tr align="center"> 54 <th>名次</th> 55 <th>姓名</th> 56 <th>成绩</th> 57 </tr> 58 <tr align="center"> 59 <td>1</td> 60 <td>小明</td> 61 <td>100</td> 62 </tr> 63 <tr align="center"> 64 <td>2</td> 65 <td>小红</td> 66 <td>95.5</td> 67 </tr> 68 </table> 69 </br> 70 <input id="Button1" type="button" value="导出" 71 onclick="exportOffice(‘targetTable‘)" /> 72 </body> 73 </html>

原文链接 http://www.jianshu.com/p/a3642877d590  

方法二

 1 var tableToExcel = (function() { 
 2 var uri = ‘data:application/vnd.ms-excel;base64,‘, 
 3 template = ‘<html><head><meta charset="UTF-8"></head><body><table>{table}</table></body></html>‘, 
 4 base64 = function(s) { return window.btoa(unescape(encodeURIComponent(s))) }, 
 5 format = function(s, c) { 
 6 return s.replace(/{(\w+)}/g, 
 7 function(m, p) { return c[p]; }) } 
 8 return function(table, name) { 
 9 if (!table.nodeType) table = document.getElementById(table) 
10 var ctx = {worksheet: name || ‘Worksheet‘, table: table.innerHTML} 
11 window.location.href = uri + base64(format(template, ctx)) 
12 } 
13 })()

 

js导出excel ()基于 OpenXML 支持 2007版本以上 浏览器 data 协议) 无须ie插件支持.

标签:enter   toe   com   display   nodetype   font   head   targe   element   

原文地址:http://www.cnblogs.com/dangyuqiang/p/7428499.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!