有没有办法将html表导出到适用于所有浏览器的Excel中？
[英]Is there any way to export html table into Excel working in all browsers?
问题描述
I used below code for that but its works only in Firefox. 
我使用下面的代码，但它仅适用于Firefox。 It also not allow customize exported file name. 它也不允许自定义导出的文件名。 It takes a random file name. 它需要一个随机文件名。
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();
}
})();
3 个解决方案
解决方案1
2 2014-11-19 16:00:24
The following code worked perfect for me with IE8+, Chrome and Firefox! 以下代码适用于IE8 +，Chrome和Firefox！ It´s the easiest way to Export HTML tables to Excel without using a blob, ActiveX-Elements or downloadify: 这是在不使用blob，ActiveX-Elements或downloadify的情况下将HTML表格导出到Excel的最简单方法：
Just insert an empty Iframe in your HTML document: 只需在HTML文档中插入一个空的Iframe：
<iframe id="txtArea1" style="display:none"></iframe>
Add the following function to your Script section and replace the table id: 将以下函数添加到“脚本”部分并替换表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);
}
and finally call the function: 最后调用函数：
<button id="btnExport" onclick="fnExcelReport();"> EXPORT </button>
or with JQuery: 或者使用JQuery：
$("#btnExport").click(function () {
fnExcelReport();
});
解决方案2
1 已采纳 2013-11-18 13:07:46
Try a blob . 尝试一下blob 。 Should work in IE10+, Chrome/Safari and Fx 应该适用于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");
}
解决方案3
0 2013-11-18 13:04:47
The Firefox supports the HTML 5 feature data-uri here data:application Firefox支持HTML 5功能data-uri这里是data:application
If you want to make it work across all browsers, better do it in server side and set the response ContentType accordingly. 如果要使其适用于所有浏览器，最好在服务器端执行此操作并相应地设置响应ContentType 。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.