有没有办法将 html 表格导出到在所有浏览器中工作的 Excel 中？答案

【问题标题】：Is there any way to export html table into Excel working in all browsers?有没有办法将 html 表格导出到在所有浏览器中工作的 Excel 中？
【发布时间】：2013-12-01 15:20:43
【问题描述】：

我为此使用了下面的代码，但它仅适用于 Firefox。它也不允许自定义导出的文件名。它需要一个随机的文件名。

 var tableToExcel = (function () {
        var uri = 'data:application/vnd.ms-excel;base64,'
          , template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" ><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 window.btoa(unescape(encodeURIComponent(s))) }
          , format = function (s, c) { return s.replace(/{(\w+)}/g, function (m, p) { return c[p]; }) }
        return function (table, name, filename) {
            var OriginalHTML = $('#' + table + '').html();
            if (!table.nodeType) {

                table = document.getElementById(table);
                $(table).find(".EditColumns").remove();
            }
            var ctx = { worksheet: name || 'Worksheet', table: table.innerHTML }
            $(table).html(OriginalHTML);

            //window.location.href = uri + base64(format(template, ctx))
            document.getElementById("aExportTable").href = uri + base64(format(template, ctx));
            document.getElementById("aExportTable").download = filename;
            document.getElementById("aExportTable").click();
            HighlightSelectedRow();
        }
    })();

【问题讨论】：

如果你想在 Javascript 中使用它，你就出局了。如果你想在 PHP 中使用它，你就在
一个 CSV 文件可以被 Excel 读取，并且可能更容易编程......
可以从任何浏览器直接将 HTML TABLE 导入 Excel

标签： javascript jquery html excel html-table

【解决方案1】：

试试blob。应该可以在 IE10+、Chrome/Safari 和 Fx 中运行

  window.URL = window.URL || window.webkitURL;
  var blob = new Blob([format(template, ctx)]); // format is part of OP's code
  var blobURL = window.URL.createObjectURL(blob);
  if (blobURL) {
    $("<a/>")
      .attr("href", blobURL)
      .attr("download", fileName)
      .text("Download "+fileName+" for import")
      .appendTo('#downloadLink');
  }
  else {
    $("#downloadLink").html("Please cut and paste from the table below");
  }

【讨论】：

您好，请告诉我格式函数的定义。除了我的 Safari 浏览器之外，Blob 工作正常。
查看OP的代码format = function (s, c) { return s.replace(/{(\w+)}/g, function (m, p) { return c[p]; }) }

【解决方案2】：

以下代码在 IE8+、Chrome 和 Firefox 上非常适合我！这是无需使用 blob、ActiveX-Elements 或下载即可将 HTML 表格导出到 Excel 的最简单方法：

只需在 HTML 文档中插入一个空的 iframe：

<iframe id="txtArea1" style="display:none"></iframe>

将以下函数添加到您的脚本部分并替换表 id：

function fnExcelReport()
        {
              var tab_text="<table border='2px'><tr bgcolor='#87AFC6'>";
              var textRange; var j=0;
              tab = document.getElementById('headerTable'); // id of table


              for(j = 0 ; j < tab.rows.length ; j++) 
              {     
                    tab_text=tab_text+tab.rows[j].innerHTML+"</tr>";
                    //tab_text=tab_text+"</tr>";
              }

              tab_text=tab_text+"</table>";
              tab_text= tab_text.replace(/<A[^>]*>|<\/A>/g, "");//remove if u want links in your table
              tab_text= tab_text.replace(/<img[^>]*>/gi,""); // remove if u want images in your table
                          tab_text= tab_text.replace(/<input[^>]*>|<\/input>/gi, ""); // reomves input params

                   var ua = window.navigator.userAgent;
                  var msie = ua.indexOf("MSIE "); 

                     if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./))      // If Internet Explorer
                        {
                               txtArea1.document.open("txt/html","replace");
                               txtArea1.document.write(tab_text);
                               txtArea1.document.close();
                               txtArea1.focus(); 
                                sa=txtArea1.document.execCommand("SaveAs",true,"Say Thanks to Sumit.xls");
                              }  
                      else                 //other browser not tested on IE 11
                          sa = window.open('data:application/vnd.ms-excel,' + encodeURIComponent(tab_text));  


                          return (sa);
          }

最后调用函数：

<button id="btnExport" onclick="fnExcelReport();"> EXPORT </button>

或使用 JQuery：

$("#btnExport").click(function () {

            fnExcelReport();
        });

【讨论】：

是的，这是工作。非常感谢。
我使用而不是 jquery。！！！！ Jquery 没试过。
你能告诉我们如何设置下载的表名和文件名
这在 IE 中运行良好，谢谢！！但是我得到的数据没有边界，是不是因为所有数据都在一个 textArea 中？您能否建议一种方法来获取所有行和列的边框？

【解决方案3】：

Firefox 支持HTML 5 功能data-uri 此处为data:application

如果你想让它在所有浏览器上工作，最好在服务器端做，并设置响应ContentTypeaccordingly。

【讨论】：