js導出excel方法

  1 js導出Excel
  2 <!DOCTYPE html>
  3 <html>
  4 <head>
  5     <meta charset="UTF-8">
  6     <style type="text/css">
  7         table{border-collapse: collapse; }
  8         th, td{border: 1px solid #4d4d4d;padding: 5px; }
  9     </style>
 10     <script type="text/javascript" language="javascript">
 11         var idTmr;
 12         function  getExplorer() {
 13             var explorer = window.navigator.userAgent ;
 14             //ie
 15             if (explorer.indexOf("MSIE") >= 0) {
 16                 return 'ie';
 17             }
 18             //firefox
 19             else if (explorer.indexOf("Firefox") >= 0) {
 20                 return 'Firefox';
 21             }
 22             //Chrome
 23             else if(explorer.indexOf("Chrome") >= 0){
 24                 return 'Chrome';
 25             }
 26             //Opera
 27             else if(explorer.indexOf("Opera") >= 0){
 28                 return 'Opera';
 29             }
 30             //Safari
 31             else if(explorer.indexOf("Safari") >= 0){
 32                 return 'Safari';
 33             }
 34         }
 35         function method1(tableid) {//整個表格拷貝到EXCEL中
 36             if(getExplorer()=='ie') {
 37                 var curTbl = document.getElementById(tableid);
 38                 var oXL = new ActiveXObject("Excel.Application");
 39 
 40                 //建立AX對象excel
 41                 var oWB = oXL.Workbooks.Add();
 42                 //獲取workbook對象
 43                 var xlsheet = oWB.Worksheets(1);
 44                 //激活當前sheet
 45                 var sel = document.body.createTextRange();
 46                 sel.moveToElementText(curTbl);
 47                 //把表格中的內容移到TextRange中
 48                 sel.select;
 49                 //全選TextRange中內容
 50                 sel.execCommand("Copy");
 51                 //複製TextRange中內容
 52                 xlsheet.Paste();
 53                 //粘貼到活動的EXCEL中
 54                 oXL.Visible = true;
 55                 //設置excel可見屬性
 56 
 57                 try {
 58                     var fname = oXL.Application.GetSaveAsFilename("Excel.xls", "Excel Spreadsheets (*.xls), *.xls");
 59                 } catch (e) {
 60                     print("Nested catch caught " + e);
 61                 } finally {
 62                     oWB.SaveAs(fname);
 63 
 64                     oWB.Close(savechanges = false);
 65                     //xls.visible = false;
 66                     oXL.Quit();
 67                     oXL = null;
 68                     //結束excel進程,退出完成
 69                     //window.setInterval("Cleanup();",1);
 70                     idTmr = window.setInterval("Cleanup();", 1);
 71                 }
 72             } else {
 73                 tableToExcel('ta')
 74             }
 75         }
 76         function Cleanup() {
 77             window.clearInterval(idTmr);
 78             CollectGarbage();
 79         }
 80 
 81         /*
 82             template : 定義文檔的類型,至關於html頁面中頂部的<!DOCTYPE> 聲明。(我的理解,不肯定)
 83             encodeURIComponent:解碼
 84             unescape() 函數:對經過 escape() 編碼的字符串進行解碼。
 85             window.btoa(window.encodeURIComponent(str)):支持漢字進行解碼。
 86             \w :匹配包括下劃線的任何單詞字符。等價於’[A-Za-z0-9_]’
 87             replace()方法:用於在字符串中用一些字符替換另外一些字符,或替換一個與正則表達式匹配的子串。
 88             {(\w+)}:匹配全部 {1個或更多字符} 形式的字符串;此處匹配輸出內容是 「worksheet」
 89             正則中的() :是爲了提取匹配的字符串。表達式中有幾個()就有幾個相應的匹配字符串。
 90             講解(/{(\w+)}/g, function(m, p) { return c[p]; } :
 91                 /{(\w+)}/g 匹配出全部形式爲「{worksheet}」的字符串;
 92                 function參數:  m  正則所匹配到的內容,即「worksheet」;
 93                                 p  正則表達式中分組的內容,即「(\w+)」分組中匹配到的內容,爲「worksheet」;
 94                 c :爲object,見下圖3
 95                 c[p] : 爲「worksheet」
 96 
 97         */
 98         var tableToExcel = (function() {
 99 /* 
100 * 設置樣式 有2個方法 1.直接寫style 屬性 2.在模板中加樣式代碼 以下
101 * */
102             var uri = 'data:application/vnd.ms-excel;base64,',
103             //template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>',
104             template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel"' +
105             'xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet>'
106             + '<x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets>'
107             + '</x:ExcelWorkbook></xml><![endif]-->' +
108             ' <style type="text/css">' +
109             'table td {' +
110             'border: 1px solid #000000;' +
111             'width: 200px;' +
112             'height: 30px;' +
113             ' text-align: center;' +
114             'background-color: #4f891e;' +
115             'color: #ffffff;' +
116             ' }' +
117             '</style>' +
118             '</head><body ><table class="excelTable">{table}</table></body></html>';
119             base64 = function(s) {
120                 return window.btoa(unescape(encodeURIComponent(s)))
121             },
122             // 下面這段函數做用是:將template中的變量替換爲頁面內容ctx獲取到的值
123             format = function(s, c) {
124                     return s.replace(/{(\w+)}/g,
125                                     function(m, p) {
126                                         return c[p];
127                                     }
128                     )
129             };
130             return function(table, name) {
131                 if (!table.nodeType) {
132                     table = document.getElementById(table)
133                 }
134                 // 獲取表單的名字和表單查詢的內容
135                 var ctx = {worksheet: name || 'Worksheet', table: table.innerHTML};
136                 // format()函數:經過格式操做使任意類型的數據轉換成一個字符串
137                 // base64():進行編碼
138                 window.location.href = uri + base64(format(template, ctx))
139 // 下面這個是自定義文件名的
140 document.getElementById("exportExcel").href = uri
141                 + base64(format(template, ctx));
142         document.getElementById("exportExcel").download = name + ".xls";//自定義文件名
143         document.getElementById("exportExcel").click();          }
144         })()
145     </script>
146 
147 </head>
148 <body>
149     <table id="ta">
150         <tr>
151             <th></th>
152             <th></th>
153             <th></th>
154             <th></th>
155             <th></th>
156         </tr>
157         <tr>
158             <td>萬籟寂無聲</td>
159             <td>衾鐵棱棱近五更</td>
160             <td>香斷燈昏吟未穩</td>
161             <td>悽清</td>
162             <td>只有霜華伴月明</td>
163         </tr>
164         <tr>
165             <td>應是夜寒凝</td>
166             <td>惱得梅花睡不成</td>
167             <td>我念梅花花念我</td>
168             <td>關情</td>
169             <td>起看清冰滿玉瓶</td>
170         </tr>
171     </table>
172     <br/>
173     <input type="button" value="導出EXCEL" onclick="method1('ta')" />
174 </body>
175 </html>
相關文章
相關標籤/搜索