HTML表格到Excel的Javascript [英] HTML Table to Excel Javascript
问题描述
我正在尝试使用此脚本将html表保存到Excel文件，并且它可以正常工作，但是它不会出现在正确的名称中，而是使用随机字符串。
我不明白为什么。
I'm trying to use this script to save a html table to an Excel file, and it works fine, however it doesn't come up in the proper name, but rather with a random string. And I can't see why .
我打电话给：
<input type="button" onclick="tableToExcel('tablename', 'name')" value="Export to 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))
}
})()
推荐答案
您可以使用下载属性由现代浏览器a支持 a 锚点元素。首先通过添加一个不可见的锚来修改你的HTML：
You can use download attribute supported by modern browsera for a anchor element. First modify your HTML by adding an invisible anchor:
<a id="dlink" style="display:none;"></a>
<input type="button" onclick="tableToExcel('tablename', 'name', 'myfile.xls')" value="Export to Excel">
还要注意，函数 tableToExcel 现在有第三个参数 - 您指定的文件名。
Notice also that the call to function tableToExcel now has 3rd parameter - where you specify file name.
现在使用原来功能的修改后的代码：
Now use this modified code of your original function:
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, filename) {
if (!table.nodeType) table = document.getElementById(table)
var ctx = { worksheet: name || 'Worksheet', table: table.innerHTML }
document.getElementById("dlink").href = uri + base64(format(template, ctx));
document.getElementById("dlink").download = filename;
document.getElementById("dlink").click();
}
})()
注意最后3个代码行：而不是将URL分配给窗口 - 它们将其分配给新的锚点，然后使用新的下载属性强制下载为给定的文件名，然后简单调用 click（）锚点的方法。
Notice last 3 code lines: Instead of assigning URL to window - they assign it to the new anchor, then use new download attribute to force download as the given file name and then simple call click() method of the anchor.
试试看。
这篇关于HTML表格到Excel的Javascript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
