<p> 项目中多处需要将页面table表格导出excel，以前做法是server端写业务代码去查db，重新组织数据，生成excel，此种做法灵活性、适用性比较广，但是无法通用，鉴于此，开发一个将页面table数据直接转为excle的小工具，可以将简单的table转excel，实现所见即所得的效果，大致思路为将table读取转成json串传入后端，后端解析json串生成excel，以下为代码：</p>
<p>前端部分工具类excelExcel.js如下：</p>
<p></p>
<pre class="blockcode"><code class="language-javascript">/**
用法：ExcelExport.export(tableId, options);
options : {
url: 后台处理请求的url
type：请求类型post & get, 默认post
postKey：发起请求json数据key,默认jsonData
getCellValue(cell): 可重载的获取cell内数据的方法
extendCellObject(cellObject, cell)生成cell对象后，执行该方法
ajax(json)：发起请求方法，可重载
}
*/
(function() {
var ExcelExport = {
extend: function(destination, source) {
for (var property in source) {
destination[property] = source[property];
}
return destination;
},
getTable: function(tid) {
return document.getElementById(tid);
},
option: function (options) {
var parent = this;
var staticOption = {
url: '/dataExport',
type: 'post',
postKey: 'jsonData',
fileName: 'excelFile',
getCellValue: function (cell) {
return cell.textContent ? cell.textContent
: cell.innerHTML ? cell.innerHTML : '';
},
extendCellObject: function (obj, cell) {
return obj;
},
ajax: function (data) {
var postData = {};
postData[this.postKey] = encodeURIComponent(data);
postData['dataType'] = 'json';
postData['fileType'] = 'xls';
postData['fileName'] = encodeURIComponent(this.fileName);
parent.submitData(postData, this.url, this.type);
}
};
return this.extend(staticOption, options || {});
},
newDom: function (tag, type, name, value) {
var dom = document.createElement(tag);
dom.type = type;
dom.value = value;
dom.name = name;
return dom;
},
submitData: function (data, url, method) {
var form = document.createElement("form");
for (var d in data) {
form.appendChild(this.newDom('input', 'hidden', d, data[d]));
}
form.action = url;
form.method = method;
form.style.display = 'none';
document.body.appendChild(form);
form.submit();
},
toJson: function (array) {
var json = '[';
for (var i = 0; i < array.length; i++) {
if (i !== 0) {
json += ',';
}
json += '[';
for (var j = 0; j < array[i].length; j++) {
if (j !== 0) {
json += ',';
}
var obj = array[i][j];
var attIndex = 0;
json += '{';
for (var att in obj) {
if (attIndex !== 0) {
json += ',';
}
attIndex ++;
json += '"' + att + '":"' + obj[att] +'"';
}
json += '}';
}
json += ']';
}
json += ']';
return json;
},
exp: function(id, optionObj) {
var dataTable = this.getTable(id);
var options = this.option(optionObj);
var rowArry = new Array(dataTable.rows.length);
for (var i = 0; i < dataTable.rows.length; i++) {
var row = dataTable.rows[i];
var colArray = new Array(row.cells.length);
for (var j = 0; j < row.cells.length; j++) {
var cell = row.cells[j];
var obj = {};
obj.value = options.getCellValue(cell);
if (cell.colSpan && cell.colSpan > 1) {
obj.colspan = cell.colSpan;
}
if (cell.rowSpan && cell.rowSpan > 1) {
obj.rowspan = cell.rowSpan;
}
if (cell.style.backgroundColor) {
obj.backgrou |
|
转播
