<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文件的更多相关文章

  1. EasyUI 如何结合JS导出Excel文件

    出处:http://blog.csdn.net/jumtre/article/details/41119991 EasyUI 如何结合JS导出Excel文件 分类: 技术 Javascript jQu ...

  2. js导出excel

    function inportEx() { $("#btnEx").text("导出中..."); var fugNumber = "";/ ...

  3. ExtJS Grid导出excel文件

    ExtJS Grid导出excel文件, 需下载POI:链接:http://pan.baidu.com/s/1i3lkPhF 密码:rqbg 1.将Grid表格数据连同表格列名传到后台 2.后台导出e ...

  4. [置顶] Jsp中的table多表头导出excel文件

    首先引入两份JS:copyhtmltoexcel.js以及 tableToExcel.js /* * 默认转换实现函数,如果需要其他功能,需自行扩展 * 参数: * tableID : HTML中Ta ...

  5. JQGrid导出Excel文件

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  6. 如何使用JavaScript实现纯前端读取和导出excel文件

    js-xlsx 介绍 由SheetJS出品的js-xlsx是一款非常方便的只需要纯JS即可读取和导出excel的工具库,功能强大,支持格式众多,支持xls.xlsx.ods(一种OpenOffice专 ...

  7. HTML导出Excel文件(兼容IE及所有浏览器)

    注意:IE浏览器需要以下设置: 打开IE,在常用工具栏中选择“工具”--->Internet选项---->选择"安全"标签页--->选择"自定义级别&q ...

  8. 利用PHPExcel导出excel 以及利用js导出excel

    导出excel的方法output_excel需要依赖PHPExcel 导出csv的方法csv_export不需要 <?php /** * @author ttt */ class ExcelCo ...

  9. JavaScript 上万条数据 导出Excel文件(改装版)

    最近项目要js实现将数据导出excel文件,网上很多插件实现~~那个开心呀,谁知道后面数据量达到上万条时出问题:浏览器不仅卡死,导出的excel文件一直提示网络失败.... debug调试发现var  ...

随机推荐

  1. c# AutoMapper 使用方式和再封装

    安装方式:使用vs自带的nuget管理工具,搜索AutoMapper ,选择第一个安装到你的项目即可. 我从网上找了一些资料, 参考网址:http://blog.csdn.net/csethcrm/a ...

  2. servlet_4

    过滤器入门 过滤器的概念及执行基本流程 过滤器的使用场景 过滤器的实现及基本配置 过滤器链 过滤器链的配置 使用注解的方式无法保证过滤器链的执行顺序,所以只能使用web.xml的配置 按照出现在web ...

  3. C# 如何保证对象线程内唯一:数据槽(CallContext)【转载】

    如果说,一个对象保证全局唯一,大家肯定会想到一个经典的设计模式:单例模式,如果要使用的对象必须是线程内唯一的呢? 数据槽:CallContext,ok看下msdn对callcontent的解释. Ca ...

  4. MUI在项目中使用时遇到的问题的个人分享

    picker 添加年插件问题总结 1. 取消按钮点击事件无法获取 可以获取到取消按钮标签和确定按钮标签 但是只能获取去顶按钮事件,取消点击事件无法获取 通过判断picker的display状态也不能确 ...

  5. JDK安装教程

    打开我的电脑,在D盘中新建一个文件夹,名字为develop 进入develop,创建一个新文件夹,名字叫做jdk 双击JDK的安装包, .4.出如图所示的框,选择下一步 .5.更改安装路径,选择更改 ...

  6. VSFTP的使用

    一.基本安装 1.安装服务 yum -y install vsftpd //centos Redhat apt-get install vsftpd //debian ubuntu 2.开启服务 se ...

  7. sql 查询结果转百分比

    select convert(varchar,convert(decimal(10,2),迟到人次*1.0/在校生人数*100))+'%'

  8. Linux系统编程——Daemon进程

    目录 Daemon进程介绍 前提知识 Daemon进程的编程规则 Daemon进程介绍 Daemon运行在后台也称作"后台服务进程". 它是没有控制终端与之相连的进程.它独立与控制 ...

  9. 离线手动部署docker镜像仓库——harbor仓库(HTTPS)

    实验环境: harbor服务器系统:CentOS Linux release 7.5.1804 (Core)harbor服务器IP:10.1.12.114harbor版本:v1.5.0docker版本 ...

  10. element-ui-verify使用

    element-ui-verify是对ElementUI原本的校验封装之后的插件,并不会影响使用ElementUI的原生校验. 使用环境为vue+element-ui+webpack模块环境,首先使用 ...