文章目录
  1. 1. 例子
  2. 2. 主体函数

将table数据转为Excel表格放到前端来做可以减少服务器的压力,而且不受网速影响,速度响应快。

例子

  1. 原生js实现table数据转为Excel表格
  2. jquery.table2excel.js实现table数据转为Excel表格

主体函数

原生js的主要函数如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
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 method(tableid) {
var fileName = document.getElementById("fileName").value.replace(/\s/g, "");
if (getExplorer() == 'ie') {
// 一种方法,但是没办法修改文件名
// var curTbl = document.getElementById(tableid);
// var oXL = new ActiveXObject("Excel.Application");
// var oWB = oXL.Workbooks.Add();
// var oSheet = oWB.ActiveSheet;
// var Lenr = curTbl.rows.length;
// for (i = 0; i < Lenr; i++) {
// var Lenc = curTbl.rows(i).cells.length;
// for (j = 0; j < Lenc; j++) {
// oSheet.Cells(i + 1, j + 1).value = curTbl.rows(i).cells(j).innerText;
// }
// }
// oXL.Visible = true;


// 第二种方法,可命名文件名
try {
var winname = window.open('', '_blank', 'top=10000');
var strHTML = document.getElementById(tableid).innerHTML;

winname.document.open('application/vnd.ms-excel', 'export excel');
winname.document.writeln(strHTML);
winname.document.execCommand('saveas', '', fileName + '.xls');
winname.close();
} catch (e) {
alert(e.description);
}

} else {
tableToExcel(tableid, fileName);
}
}
var tableToExcel = (function () {
var uri = 'data:application/vnd.ms-excel;base64,',
template = '<html><head><meta charset="UTF-8"></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, fileName) {
if (!table.nodeType) {
table = document.getElementById(table);
}
var dlink = document.getElementById("dlink");
var ctx = {
worksheet: fileName ? fileName : 'Worksheet',
table: table.innerHTML
}
dlink.href = uri + base64(format(template, ctx));
dlink.download = fileName + ".xls";
dlink.click();
}
})()

使用jquery.table2excel.js的方式为:

1
2
3
4
5
6
7
8
9
10
11
$("#btnExport").click(function () {
$("#tableExcel").table2excel({
exclude: ".noExl", //过滤位置的 css 类名
filename: $.trim($("#fileName").val()) + ".xls", //文件名称
name: "Excel Document Name.xlsx",
exclude_img: true,
exclude_links: true,
exclude_inputs: true

});
});

关于jquery.table2excel.js还可前去其github查看。

文章目录
  1. 1. 例子
  2. 2. 主体函数