下面是完整的代码,exportTable是直接调用的方法,tableid是table标签的id,
selectField是筛选的数组,只有数组中的列会导出,name是导出的文件名
var idTmr;
function getExplorer() {
var explorer = window.navigator.userAgent ;
//ie
if (explorer.indexOf("MSIE") >= 0) {
return 'ie';
}
//firefox
else if (explorer.indexOf("Firefox") >= 0) {
return 'Firefox';
}
//Chrome
else if(explorer.indexOf("Chrome") >= 0){
return 'Chrome';
}
//Opera
else if(explorer.indexOf("Opera") >= 0){
return 'Opera';
}
//Safari
else if(explorer.indexOf("Safari") >= 0){
return 'Safari';
}
}
function exportTable(tableid,selectField,name) {
var ahtml = ' <a href="#" id="exportExcel" style="display:none" ></a>';
if(!document.getElementById("exportExcel"))
$("body").append(ahtml);
if(getExplorer()=='ie')
{
var curTbl = gridTable(tableid,selectField);
var oXL = new ActiveXObject("Excel.Application");
var oWB = oXL.Workbooks.Add();
var xlsheet = oWB.Worksheets(1);
var sel = this.document.body.createTextRange();
sel.moveToElementText(curTbl);
sel.select();
sel.execCommand("Copy");
xlsheet.Paste();
oXL.Visible = true;
try {
var fname = oXL.Application.GetSaveAsFilename("Excel.xls", "Excel Spreadsheets (*.xls), *.xls");
} catch (e) {
print("Nested catch caught " + e);
} finally {
oWB.SaveAs(fname);
oWB.Close(savechanges = false);
oXL.Quit();
oXL = null;
idTmr = window.setInterval("Cleanup();", 1);
}
}
else
{
tableToExcel.call(this,tableid,selectField,name);
}
}
function Cleanup() {
window.clearInterval(idTmr);
CollectGarbage();
}
function gridTable(tableid,selectField){
var columnModel = this.$("#"+tableid).jqGrid('getGridParam', 'colModel');
var dataModel = this.$("#"+tableid).jqGrid("getRowData");
var footerData = this.$("#"+tableid).jqGrid("footerData");
var table = ["<table cellspacing=\"0\" cellpadding=\"5\" rules=\"all\" border=\"1\">"];
//写出列名
table.push("<tr style=\"background-color: #FFE88C;font-weight: bold; white-space: nowrap;\">");
$.each(columnModel,function(i,jqgridcolumn){
if($.inArray(jqgridcolumn.name,selectField)>=0 && !!jqgridcolumn.label && !jqgridcolumn.hidden){
table.push("<td style=\"width:" + jqgridcolumn.width + "px;text-align:" + jqgridcolumn.align + "\">" + jqgridcolumn.label + "</td>");
}
});
table.push("</tr>");
//写数据
$.each(dataModel,function(i,row){
table.push("<tr>");
$.each(columnModel,function(i,jqgridcolumn){
if($.inArray(jqgridcolumn.name,selectField)>=0 && !!jqgridcolumn.label && !jqgridcolumn.hidden){
var text = row[jqgridcolumn.name];
table.push("<td style=\"vnd.ms-excel.numberformat:@;width:" + jqgridcolumn.width + "px;text-align:" + jqgridcolumn.align + "\">"+text+"</td>");
}
});
table.push("</tr>");
});
table.push("</table>");
return $(table.join(""))[0];
}
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]-->'
+'<meta charset="UTF-8"></head>'
+'<body>{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, selectField, name) {
if (!table.nodeType) table = gridTable(table,selectField);
var ctx = {worksheet: name || 'Worksheet', table: table.outerHTML}
document.getElementById("exportExcel").href = uri
+ base64(format(template, ctx));
document.getElementById("exportExcel").download = name + ".xls";//自定义文件名
document.getElementById("exportExcel").click();
//window.location.href = uri + base64(format(template, ctx))
}
})()
以上是所有代码,因为用的是jqgrid的插件,所以中间有一段代码,使用jqgrid的方法拼接成一个新的表格,这样使用上更加灵活,不仅可以改变样式和结构,还能选择需要导出的列
function gridTable(tableid,selectField){
var columnModel = this.$("#"+tableid).jqGrid('getGridParam', 'colModel');
var dataModel = this.$("#"+tableid).jqGrid("getRowData");
var footerData = this.$("#"+tableid).jqGrid("footerData");
var table = ["<table cellspacing=\"0\" cellpadding=\"5\" rules=\"all\" border=\"1\">"];
//写出列名
table.push("<tr style=\"background-color: #FFE88C;font-weight: bold; white-space: nowrap;\">");
$.each(columnModel,function(i,jqgridcolumn){
if($.inArray(jqgridcolumn.name,selectField)>=0 && !!jqgridcolumn.label && !jqgridcolumn.hidden){
table.push("<td style=\"width:" + jqgridcolumn.width + "px;text-align:" + jqgridcolumn.align + "\">" + jqgridcolumn.label + "</td>");
}
});
table.push("</tr>");
//写数据
$.each(dataModel,function(i,row){
table.push("<tr>");
$.each(columnModel,function(i,jqgridcolumn){
if($.inArray(jqgridcolumn.name,selectField)>=0 && !!jqgridcolumn.label && !jqgridcolumn.hidden){
var text = row[jqgridcolumn.name];
table.push("<td style=\"vnd.ms-excel.numberformat:@;width:" + jqgridcolumn.width + "px;text-align:" + jqgridcolumn.align + "\">"+text+"</td>");
}
});
table.push("</tr>");
要设置导出excel的文件名没有直接的方法,只能通过临时创建一个a标签,设置download属性为文件名,然后触发点击事件,“exportExcel”就是我临时创建a标签的id
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]-->'
+'<meta charset="UTF-8"></head>'
+'<body>{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, selectField, name) {
if (!table.nodeType) table = gridTable(table,selectField);
var ctx = {worksheet: name || 'Worksheet', table: table.outerHTML}
document.getElementById("exportExcel").href = uri
+ base64(format(template, ctx));
document.getElementById("exportExcel").download = name + ".xls";//自定义文件名
document.getElementById("exportExcel").click();
//window.location.href = uri + base64(format(template, ctx))
}
})()
以上