在Firefox浏览器中将动态html表导出到javascript中的excel答案

【问题标题】：Export dynamic html table to excel in javascript in firefox browser在Firefox浏览器中将动态html表导出到javascript中的excel
【发布时间】：2011-08-05 11:37:52
【问题描述】：

想在 javascript 中将动态 html 表导出到 excel 中，我有什么办法可以在 firefox 浏览器中做而不在代码中使用 activex 对象。请帮助我

【问题讨论】：

Java以什么方式参与？
jsp代码包含一个按钮Export to Excel，当点击网格中的动态表格时，将在excel中用css生成。这个按钮代码是用JavaScript连接的

标签： javascript excel firefox

【解决方案1】：

Here's a function 在 Firefox 中使用 JavaScript 执行此操作，假设用户在他们的计算机上安装了 Excel：

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" 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 window.btoa(unescape(encodeURIComponent(s))) }
    , format = function(s, c) { return s.replace(/{(\w+)}/g, function(m, p) { return c[p]; }) }
  return function(table, name) {
    if (!table.nodeType) table = document.getElementById(table)
    var ctx = {worksheet: name || 'Worksheet', table: table.innerHTML}
    window.location.href = uri + base64(format(template, ctx))
  }
})()

jsFiddle 实例：

http://jsfiddle.net/insin/cmewv/

【讨论】：

感谢它的工作只是一个小问题，它没有将 css 从表导出到 excel 我怎么能在这个函数中做到这一点。你能帮我吗
有没有办法让它与 IE 一起工作？在 FF 中效果很好，但我真的需要一个跨浏览器的解决方案。
这里的IE解决方案stackoverflow.com/questions/6566831/…
这不适用于特殊字符。 i、Ü、Ş、ç、Ö 等字符无法正常显示。
这在 IE 中有效吗？此外，如果列中有 HTML 标签，它会显示输出还是原始 HTML 标签？ stackoverflow.com/questions/27805209/…。在 IE 中，URL 变为某些加密文本，并指出网页无法显示。

【解决方案2】：

您可以动态生成 SpreadsheetDataXML 格式的 Excel 文件，它允许您自定义表格、单元格样式和 HTML 语法格式。

要在 IE 中进行这项工作，您需要使用 Blob 对象，然后调用 msSaveBlob 方法。对于 FF 和 Chrome，您只需将 href 的数据更改为 data:application/vnd.ms-excel

function fnExcelReport() {
    var tab_text = '<html xmlns:x="urn:schemas-microsoft-com:office:excel">';
    tab_text = tab_text + '<head><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet>';

    tab_text = tab_text + '<x:Name>Test Sheet</x:Name>';

    tab_text = tab_text + '<x:WorksheetOptions><x:Panes></x:Panes></x:WorksheetOptions></x:ExcelWorksheet>';
    tab_text = tab_text + '</x:ExcelWorksheets></x:ExcelWorkbook></xml></head><body>';

    tab_text = tab_text + "<table border='1px'>";
    tab_text = tab_text + $('#myTable').html();
    tab_text = tab_text + '</table></body></html>';

    var data_type = 'data:application/vnd.ms-excel';

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

    if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) {
        if (window.navigator.msSaveBlob) {
            var blob = new Blob([tab_text], {
                type: "application/csv;charset=utf-8;"
            });
            navigator.msSaveBlob(blob, 'Test file.xls');
        }
    } else {
        $('#test').attr('href', data_type + ', ' + encodeURIComponent(tab_text));
        $('#test').attr('download', 'Test file.xls');
    }
}

工作示例：http://jsfiddle.net/h42y4ke2/21/ YT教程：https://www.youtube.com/watch?v=gx_yGY6NHkc

【讨论】：

我们可以在'xlsx'的扩展名中以同样的方式下载文件吗？

【解决方案3】：

AFAIK 没有用于在 JavaScript 中创建真正的 excel 文件的库，但您可以尝试将 HTML 中的表格导出到扩展名为 .xls 的文件中。

【讨论】：

@Siddharth，看看如何使用 JavaScript 编写文件，然后遍历表示表格的 DOM 部分并将相应的 HTML 写入文件。请注意，您还需要添加 <html><body> 标头和相应的页脚。

【解决方案4】：

firefox 有一个扩展名table2clipboard。您还可以手动从 DOM 树生成 csv 输出，并让用户将其保存为 csv 文件。 Excel 可以从 CSV 导入。

【讨论】：

我有一个导出到 Excel 的按钮，点击后会在 excel 中生成动态 html 表。请您帮忙
在纯 javascript 中，您可以使用数据 URI 方案生成 scv 文件。但这有几个限制。另一种选择是将数据发送回服务器，并让服务器构建 CSV 文件并提供它。