js导出excel文件
<div id="tablesDiv">
<table id="tabDiv1">
<tbody><tr>
<td>ID</td>
<td>姓名</td>
<td>年龄</td>
</tr>
<tr>
<td>0001</td>
<td>张三</td>
<td>24</td>
</tr>
</tbody></table>
<table id="tabDiv2">
<tbody><tr>
<td>ID</td>
<td>姓名</td>
<td>年龄</td>
</tr>
<tr>
<td>0002</td>
<td>李四</td>
<td>24</td>
</tr>
</tbody></table>
<table id="tabDiv3">
<tbody><tr>
<td>ID</td>
<td>姓名</td>
<td>年龄</td>
</tr>
<tr>
<td>0003</td>
<td>王五</td>
<td>24</td>
</tr>
</tbody></table>
<button onclick="exp();">export to excel...</button>
</div>
#tabDiv1,#tabDiv2,#tabDiv3 {
border:1px solid pink;
margin:10px auto;
width:100%;
}
button {
width:100%;
}
function exp() {
tablesToExcel(['tabDiv1', 'tabDiv2', 'tabDiv3'], ['yy', 'bb', 'cc'], "abc.xls", "Excel");
}
//导出excel包含多个sheet
//tables:tableId的数组;wsbames:sheet的名字数组;wbname:工作簿名字;appname:Excel
function tablesToExcel(tables, wsnames, wbname, appname) {
var uri = 'data:application/vnd.ms-excel;base64,',
tmplWorkbookXML = '<?xml version="1.0"?><?mso-application progid="Excel.Sheet"?><Workbook xmlns="urn:schemas-microsoft-com:office:spreadsheet" xmlns:ss="urn:schemas-microsoft-com:office:spreadsheet">' +
'<DocumentProperties xmlns="urn:schemas-microsoft-com:office:office"><Author>Axel Richter</Author><Created>{created}</Created></DocumentProperties>' +
'<Styles>' +
'<Style ss:ID="Currency"><NumberFormat ss:Format="Currency"></NumberFormat></Style>' +
'<Style ss:ID="Date"><NumberFormat ss:Format="Medium Date"></NumberFormat></Style>' +
'</Styles>' +
'{worksheets}</Workbook>',
tmplWorksheetXML = '<Worksheet ss:Name="{nameWS}"><Table>{rows}</Table></Worksheet>',
tmplCellXML = '<Cell{attributeStyleID}{attributeFormula}><Data ss:Type="{nameType}">{data}</Data></Cell>',
base64 = function(s) {
return window.btoa(unescape(encodeURIComponent(s)))
},
format = function(s, c) {
return s.replace(/{(\w+)}/g, function(m, p) {
return c[p];
})
}
var ctx = "";
var workbookXML = "";
var worksheetsXML = "";
var rowsXML = "";
for (var i = 0; i < tables.length; i++) {
if (!tables[i].nodeType)
tables[i] = document.getElementById(tables[i]);
// 控制要导出的行数
for (var j = 0; j < tables[i].rows.length; j++) {
rowsXML += '<Row>';
for (var k = 0; k < tables[i].rows[j].cells.length; k++) {
var dataType = tables[i].rows[j].cells[k].getAttribute("data-type");
var dataStyle = tables[i].rows[j].cells[k].getAttribute("data-style");
var dataValue = tables[i].rows[j].cells[k].getAttribute("data-value");
dataValue = (dataValue) ? dataValue : tables[i].rows[j].cells[k].innerHTML;
var dataFormula = tables[i].rows[j].cells[k].getAttribute("data-formula");
dataFormula = (dataFormula) ? dataFormula : (appname == 'Calc' && dataType == 'DateTime') ? dataValue : null;
ctx = {
attributeStyleID: (dataStyle == 'Currency' || dataStyle == 'Date') ? ' ss:StyleID="' + dataStyle + '"' : '',
nameType: (dataType == 'Number' || dataType == 'DateTime' || dataType == 'Boolean' || dataType == 'Error') ? dataType : 'String',
data: (dataFormula) ? '' : dataValue,
attributeFormula: (dataFormula) ? ' ss:Formula="' + dataFormula + '"' : ''
};
rowsXML += format(tmplCellXML, ctx);
}
rowsXML += '</Row>'
}
ctx = {
rows: rowsXML,
nameWS: wsnames[i] || 'Sheet' + i
};
worksheetsXML += format(tmplWorksheetXML, ctx);
rowsXML = "";
}
ctx = {
created: (new Date()).getTime(),
worksheets: worksheetsXML
};
workbookXML = format(tmplWorkbookXML, ctx);
// 查看后台的打印输出
//console.log(workbookXML);
var link = document.createElement("A");
link.href = uri + base64(workbookXML);
link.download = wbname || 'Workbook.xls';
link.target = '_blank';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
代码出自:JQ22.com
js导出excel文件的更多相关文章
- EasyUI 如何结合JS导出Excel文件
出处:http://blog.csdn.net/jumtre/article/details/41119991 EasyUI 如何结合JS导出Excel文件 分类: 技术 Javascript jQu ...
- js导出excel
function inportEx() { $("#btnEx").text("导出中..."); var fugNumber = "";/ ...
- ExtJS Grid导出excel文件
ExtJS Grid导出excel文件, 需下载POI:链接:http://pan.baidu.com/s/1i3lkPhF 密码:rqbg 1.将Grid表格数据连同表格列名传到后台 2.后台导出e ...
- [置顶] Jsp中的table多表头导出excel文件
首先引入两份JS:copyhtmltoexcel.js以及 tableToExcel.js /* * 默认转换实现函数,如果需要其他功能,需自行扩展 * 参数: * tableID : HTML中Ta ...
- JQGrid导出Excel文件
系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...
- 如何使用JavaScript实现纯前端读取和导出excel文件
js-xlsx 介绍 由SheetJS出品的js-xlsx是一款非常方便的只需要纯JS即可读取和导出excel的工具库,功能强大,支持格式众多,支持xls.xlsx.ods(一种OpenOffice专 ...
- HTML导出Excel文件(兼容IE及所有浏览器)
注意:IE浏览器需要以下设置: 打开IE,在常用工具栏中选择“工具”--->Internet选项---->选择"安全"标签页--->选择"自定义级别&q ...
- 利用PHPExcel导出excel 以及利用js导出excel
导出excel的方法output_excel需要依赖PHPExcel 导出csv的方法csv_export不需要 <?php /** * @author ttt */ class ExcelCo ...
- JavaScript 上万条数据 导出Excel文件(改装版)
最近项目要js实现将数据导出excel文件,网上很多插件实现~~那个开心呀,谁知道后面数据量达到上万条时出问题:浏览器不仅卡死,导出的excel文件一直提示网络失败.... debug调试发现var ...
随机推荐
- JavaScript BOM和DOM
Browser Object Model BOM是所有JavaScript的核心,所有的功能其实都建立在BOM基础之上.各浏览器提供的BOM的功能存在很大差异,BOM在HTML5中已经有很大一部分被放 ...
- Python中实用却不常见的小技巧
https://mp.weixin.qq.com/s?__biz=MzI5NDY1MjQzNA==&mid=2247489061&idx=2&sn=65cec7fa471b1e ...
- 传统、VHD、VHDX性能对比测试(转帖)
nkc3g4发表于 2014-4-30 16:24:41 传统.VHD.VHDX性能对比测试 - Windows To Go优盘系统 - 萝卜头IT论坛 - Powered by Discuz! ht ...
- jmetter 安装 建测试计划详细步骤
更多Jmetter教程 1,去官网下载最新的jmetter版本: http://jmeter.apache.org/download_jmeter.cgi 2,解压下载的jmtter安装包到D:\so ...
- Ollydbg中的内存断点和硬件断点的区别
转载自: https://www.zhihu.com/question/52625624 旅人的回复 作者:旅人链接:https://www.zhihu.com/question/52625624/a ...
- docker 搭建 hustoj
docker 搭建 hustoj hustoj 是个GPL开源的OJ,其提供了docker形式的安装方式. 为执行方便,选择使用aliyun提供的docker镜像来加速安装. 拉取镜像 docker ...
- 【原创】Windows上应用程序报错常用分析方法总结
在日常使用Windows的过程中,经常会遇到应用程序不能正常启动.关闭等使用问题.对于Windows来说,解决这些问题的方法比较多,大多时候我们可以通过百度或谷歌搜索来解决.但更多的时候,我们需要找出 ...
- python,列表,元祖,字典
list 列表 li = [1,",[3,4]] 1.用中括号括起来 2.用,来分割每一个元素 3.列表中的元素可以是,数字,字符串,列表,布尔值 4.“集合”,内部可以放置任何东西 li ...
- Win 10更新版1709有哪些新功能值得关注!
windows 10秋季创意者更新版1709发布已经有段时间了,也有很多用户选择升级这次更新的系统.那么,这次Win 10 更新版1709有哪些新功能值得关注呢?下面,一起随主机吧来看一看吧! 1. ...
- Sharding-jdbc视频:当Sharding-jdbc遇到Spring Boot
一.什么是Sharding-jdbc? 在介绍Sharding-JDBC之前,我们需要先说明下Sharding-Sphere. Sharding-Sphere是一套开源的分布式数据库中间件解决方案组成 ...