项目中签到模块需要导出每天的签到数据,一开始用poi在后台导出,window下运行没什么问题,但是把项目部署到linux环境上,提示导出路径不存在,思索良久也没有找到解决的办法,最后只能在前端使用js导出表格。本篇文章给大家分享的是实例剖析js如何导出报表的操作详解,内容挺不错的,希望可以帮助到有需要的朋友
注意:js导出表格是利用浏览器自带的下载功能去实现的,所以不需要定义下载路径,很好用,唯一的缺点就是,表格样式不知道怎么去定义。
一:导入jquery
<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
二:页面准备一个table和一个导出的按钮
<table id="mytab" border="1">
<tr>
<th>month</th>
<th>savings</th>
</tr>
<tr>
<td>january</td>
<td>$100</td>
</tr>
</table>
<input value="开始导出" type="button" id="export" onclick="method5('mytab')"> //参数为table的id
三:js代码
<script type="text/javascript">
//打印表格
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 method5(tableid) {
if (getexplorer() == 'ie') {
var curtbl = document.getelementbyid(tableid);
var oxl = new activexobject("excel.application");
var owb = oxl.workbooks.add();
var xlsheet = owb.worksheets(1);
var sel = 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(tableid)
}
}
function cleanup() {
window.clearinterval(idtmr);
collectgarbage();
}
var tabletoexcel = (function() {
var uri = 'data:application/vnd.ms-excel;base64,', template = '<html><head><meta charset="utf-8"></head><body><table border="1">{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))
}
})()
</script>
坚持总结工作中遇到的技术问题,坚持记录工作中所所思所见,欢迎大家一起探讨交流。
以上就是实例剖析js如何导出报表的详细内容。