【问题标题】:Generate excel sheet from html tables using jquery使用jquery从html表生成excel表
【发布时间】:2013-03-22 09:43:12
【问题描述】:

我想在用户单击按钮后生成一个 Excel 工作表。基本上我想做的正是这里讨论的内容

how to pass html table values to excel sheet cells (Kalle H. Väravas 回答)

JavaScript to export HTML tables to Excel

但不知何故,当我单击按钮时什么也没有发生。我正在使用 Mozilla 浏览器。我的代码需要启用 ActiveXObject。我需要做一些额外的事情来完成它吗? ?

我为测试创建了这个小提琴。如果这可行,我将尝试我的真实代码。如果这对你有用,那么也请告诉我。谢谢

jFiddle

代码:

JS:

<script type="text/javascript">
    function CreateExcelSheet() {
        var i, j, str,
                myTable = document.getElementById('mytable'),
                rowCount = myTable.rows.length,
                excel = new ActiveXObject('Excel.Application');// Activates Excel
        excel.Workbooks.Add(); // Opens a new Workbook
        excel.Application.Visible = true; // Shows Excel on the screen
        for (i = 0; i < rowCount; i++) {
            for (j = 0; j < myTable.rows[i].cells.length; j++) {
                str = myTable.rows[i].cells[j].innerText;
                excel.ActiveSheet.Cells(i + 1, j + 1).Value = str; // Writes to the sheet
            }
        }
        return;
    }
</script>

HTML:

<table id ="myTable" >
            <tr>
                <td>1</td>
                <td>Jan</td>
                <td>01/04/2012</td>
                <td>Approved</td>
            </tr>
            <tr>
                <td>2</td>
                <td>Feb</td>
                <td>01/04/2012</td>
                <td>Approved</td>
            </tr>
        </table>
        <form>
            <input type="button" onclick="CreateExcelSheet();" value="Create Excel Sheet" >
        </form>

【问题讨论】:

  • 据我所知,ActiveXObjects 只是 Internet Explorer。
  • 您可以从服务器端创建excel。您使用的是什么服务器端语言?
  • @hexblot 我猜你是对的。我的朋友刚刚向我指出了这一点。我该怎么做才能让它在所有网络浏览器上运行?
  • @slacker 我正在通过 JavaServer Pages (*.jsp) 使用 Java。我也在使用一些 JavaScript。

标签: javascript jquery html excel


【解决方案1】:

这是答案:Export dynamic html table to excel in javascript in firefox browser by insin

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))
      }
    })()

【讨论】:

  • 它在 mozilla 中运行良好,但在 IE 中无法运行。有什么想法吗?
  • 它从所有数字中删除所有小数点/逗号,例如 5,1234 -> 51234
【解决方案2】:

要回答有关 IE 的问题(由于声誉限制,我无法在评论框中回答),Sharun 发布的上述代码在 IE 10+ 上无法运行(“权限被拒绝”错误)。这是一个可以在 IE 10+ 以及旧版本的 IE、Chrome 和 FF 中使用的 sn-p:

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 cellspacing="0" rules="rows" border="1" style="color:Black;background-color:White;border-color:#CCCCCC;border-width:1px;border-style:None;width:100%;border-collapse:collapse;font-size:9pt;text-align:center;">{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 }
        if (navigator.msSaveBlob) {
            var blob = new Blob([format(template, ctx)], { type: 'application/vnd.ms-excel', endings: 'native' });
            navigator.msSaveBlob(blob, 'export.xls')
        } else {
            window.location.href = uri + base64(format(template, ctx))
        }
    }
})()

【讨论】:

    【解决方案3】:
          $("#btnExport").click(function(e) {
                  e.preventDefault();
    
                //getting data from table
                var data_type = 'data:application/vnd.ms-excel';
                var table_div = document.getElementById('table_wrapper');//table_wrapper is table id
                var table_html = table_div.outerHTML.replace(/ /g, '%20');
    
                var a = document.createElement('a');
                a.href = data_type + ', ' + table_html;
                a.download = 'table_name_' + Math.floor((Math.random() * 9999999) + 1000000) + '.xls';
                a.click();
              });   
    

    【讨论】:

      【解决方案4】:

      你可以使用这个不错的库:https://github.com/jmaister/excellentexport

      【讨论】:

      • 但在打开文件之前显示警告消息。
      猜你喜欢
      • 2014-05-01
      • 1970-01-01
      • 1970-01-01
      • 2012-10-06
      • 1970-01-01
      • 2011-06-20
      • 2013-08-28
      • 2016-11-01
      • 1970-01-01
      相关资源
      最近更新 更多