将HTML表导出到xlsx

时间:2016-05-10 11:03:20

标签: javascript jquery html excel xlsx

这是一个将HTML表格转换为xlsx的简单代码。导出的文件带有xlsx扩展名,但是当我尝试打开文件时出现错误" Excel无法打开文件,因为文件格式或文件扩展名无效。"

我无法解决此问题。将HTML导出为.xlsx文件是必需的。我如何解决这个问题,或者有没有更好的方法可以不使用第三方JavaScript。

我的代码

的Javascript

 <script>
      var isIE = /*@cc_on!@*/false || !!document.documentMode;
      function ExportToExcel(ExTable){
           tableToExcel(ExTable,"XDK");
      }
      var tableToExcel = (function() {
           var uri = 'data:application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8;filename=XDK_Export;base64,'
           , 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>'
           , base64 = function(s) {
                return $.base64.encode(s)
           } 
           , format = function(s, c) {
                return s.replace(/{(\w+)}/g, function(m, p) {
                     return c[p];
                })
           }
           return function(table) {
                var objHtmlD = $("#"+table).find(".DtlTableContainer").clone()
                $(objHtmlD).find("a").each(function(index){
                     $(this).replaceWith($(this).text())
                });
                if (!table.nodeType) 
                     table = $("#"+table).find(".HdrTableContainer").html() + $(objHtmlD).html()
                var ctx = {
                     worksheet: name || 'Worksheet',
                     table: table
                }
                var sa;
                if(isIE)
                {
                     var ifrm = document.createElement('iframe');
                     ifrm.id = "txtExport";
                     ifrm.style.display = 'none';
                     document.body.appendChild(ifrm);
                     txtExport.document.open("txt/html","replace");
                     txtExport.document.write(format(template, ctx));
                     txtExport.document.close();
                     txtExport.focus();
                     sa= txtExport.document.execCommand("SaveAs",true,"XDK_Export.xlsx");
                     ifrm.parentNode.removeChild(ifrm);
                }
                else
                     sa = window.open(uri + base64(format(template, ctx)),"XDK_Export.xlsx");
                return sa;
           }
      })()
 </script>

有了这个,我也在使用jquery.base64.js

HTML

 <DIV id=Tbl>
        <DIV id=divC >
            <TABLE >
                <TBODY>
                    <TR>
                        <TD width="50%">&nbsp;
                            <input type="button" onclick="javascript:ExportToExcel(this.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.id); "
                                value="Export to Excel">
                        </TD>
                    </TR>
                </TBODY>
            </TABLE>
        </DIV>
        <DIV class=HContainer >
            <TABLE id=TblHdr >
                <THEAD>
                    <TR>
                        <TH >
                            <INPUT id=chkHdrSelect type=checkbox>
                        </TH>
                        <TH style="WIDTH: 48px">Col 1</TH>
                        <TH style="WIDTH: 48px">Col 2</TH>
                        <TH style="WIDTH: 48px">Col 3</TH>
                        <TH style="WIDTH: 48px">Col 4</TH>
                        <TH style="WIDTH: 48px">Col 5</TH>

                    </TR>
                </THEAD>
                <TBODY></TBODY>
            </TABLE>
        </DIV>
        <DIV class=DContainer >
            <TABLE id=TblDtl>
                <TBODY>
                    <TR id=ROW_0 class=GRC1>
                        <TD id=chkSelect_0_0 >
                            <INPUT  id=C_chkSelect_0_0 type=checkbox width=30 align=center value=on></INPUT>
                        </TD>
                        <TD id=Col1_0_1 > 111111 </TD>
                        <TD id=Col2_0_2 > 222222 </TD>
                        <TD id=Col3_0_3 > 333333 </TD>
                        <TD id=Col4_0_4 > 444444 </TD>
                        <TD id=Col5_0_5 > 555555 </TD>
                    </TR>
                    <TR id=ROW_1 class=GRC2>
                        <TD id=chkSelect_1_0 >
                            <INPUT id=C_chkSelect_1_0  type=checkbox width=30 align=center value=on></INPUT>
                        </TD>
                        <TD id=Col1_1_1 > 666666 </TD>
                        <TD id=Col2_1_2 > 777777 </TD>
                        <TD id=Col3_1_3 > 888888 </TD>
                        <TD id=Col4_1_4 > 999999 </TD>
                        <TD id=Col5_1_5 > 000000 </TD>
                    </TR>
                </TBODY>
            </TABLE>
        </DIV>
    </DIV>

0 个答案:

没有答案