使用sheets.js插件转换HTML表格的Excel文件中的纯JavaScript [复制](Co

2019-11-04 22:31发布

这个问题已经在这里有一个答案:

  • 遗漏的类型错误:方法是不是一个函数 1回答

所以我张贴此我找不到堆栈溢出现有的问题/答案对我的特殊问题。 我已经写在HTML和jQuery / JavaScript的应用程序。 我需要一个HTML表导出到使用jsxlsx(sheetsjs)插件的Excel工作表。 我试图复制他们为榜样,以HTML表格转换到Excel但程序出现了错误。 这是我目前有:

我的HTML代码称为books.cfm一个ColdFusion页面内。 我有我在一个名为Utils.js文件的JavaScript。 这些是:

 function s2ab(s) { var buf = new ArrayBuffer(s.length); var view = new Uint8Array(buf); for (var i=0; i<s.length; i++) view[i] = s.charCodeAt(i) & 0xFF; return buf; } function convertToExcel(event){ event.preventDefault(); console.log("button clicked"); var wb = XLSX.utils.table_to_book( $("#exceltable"), {sheet:"Exported table"} ); saveAs(new Blob([s2ab(wb)],{type:"application/octet-stream"}), 'test.xlsx'); } 
 <html> <head> <script src="libs/jquery.min.js"></script> <script src="libs/sheets/xlsx.full.min.js"></script> <script src="libs/FileSaver/FileSaver.min.js"></script> <script src="scripts/Utils.js"></script> </head> <body> <table id="myTable"> <tr> <td>ID</td> <td>Name</td> </tr> <tr> <td>1</td> <td>Johnny</td> </tr> </table> <button id="myBtn" onclick="convertToExcel(event)">Export</button> </body> </html> 

当我运行上面的代码,然后点击按钮转换到Excel中,我得到以下错误:

**Uncaught TypeError: e.getElementsByTagName is not a function
at GC (xlsx.full.min.js:20)
at Object.jC [as table_to_book] (xlsx.full.min.js:20)
at exportErrsToExcel (Util.js:1227)
at HTMLButtonElement.onclick (books.cfm:18)**

注:我从上面的JavaScript代码这个网站 。

Answer 1:

新的答案随着SheetJS工作代码:

<script type="text/javascript" src="//unpkg.com/xlsx/dist/shim.min.js"></script>
<script type="text/javascript" src="//unpkg.com/xlsx/dist/xlsx.full.min.js"></script>

<script type="text/javascript" src="//unpkg.com/blob.js@1.0.1/Blob.js"></script>
<script type="text/javascript" src="//unpkg.com/file-saver@1.3.3/FileSaver.js"></script>


<div id="container2">
  <title>SheetJS Table Export</title>
  <table id="data-table">
    <tr>
      <td>ID</td>
      <td>Name</td>
    </tr>
    <tr>
      <td>1</td>
      <td>Johnny</td>
    </tr>
  </table>
</div>
<p id="xportxlsx" class="xport"><input type="submit" value="Export to XLSX!" onclick="doit('xlsx');"></p>


<script type="text/javascript">

function doit(type, fn, dl) {
    var elt = document.getElementById('data-table');
    var wb = XLSX.utils.table_to_book(elt, {sheet:"Sheet JS"});
    return dl ?
        XLSX.write(wb, {bookType:type, bookSST:true, type: 'base64'}) :
        XLSX.writeFile(wb, fn || ('test.' + (type || 'xlsx')));
}


function tableau(pid, iid, fmt, ofile) {
    if(typeof Downloadify !== 'undefined') Downloadify.create(pid,{
            swf: 'downloadify.swf',
            downloadImage: 'download.png',
            width: 100,
            height: 30,
            filename: ofile, data: function() { return doit(fmt, ofile, true); },
            transparent: false,
            append: false,
            dataType: 'base64',
            onComplete: function(){ alert('Your File Has Been Saved!'); },
            onCancel: function(){ alert('You have cancelled the saving of this file.'); },
            onError: function(){ alert('You must put something in the File Contents or there will be nothing to save!'); }
    });
}
tableau('xlsxbtn',  'xportxlsx',  'xlsx',  'test.xlsx');

</script>

老回答:您可以使用一种变通方法,如果sheetjs不起作用。 例如DataTable的工具有用于导出HTML表到Excel插件。 演示: https://datatables.net/extensions/buttons/examples/initialisation/export.html

你可以在一个隐藏的DIV例如加载数据表,然后你的按钮“myBtn”导出感谢到Excel数据表导出按钮启动



文章来源: Convert HTML table to Excel file in pure JavaScript using sheets.js plugin [duplicate]