js导出excel表格并生成多sheet

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>ExportTablesToExcel</title>

    <script src="js/echarts.js"></script>

    <script src="js/jquery.js"></script>

</head>

<style>

    #tabDiv1,#tabDiv2,#tabDiv3{border:1px solid pink;margin:10px auto;width:100%; }

    button{width:100%;}

</style>

<body>

<div id="tablesDiv">

    <table id="tabDiv1">

        <tr>

            <td>ID</td>

            <td>姓名</td>

            <td>年龄</td>

        </tr>

        <tr>

            <td>0001</td>

            <td>张三</td>

            <td>24</td>

        </tr>

    </table>

    <table id="tabDiv2">

        <tr>

            <td>ID</td>

            <td>姓名</td>

            <td>年龄</td>

        </tr>

        <tr>

            <td>0002</td>

            <td>李四</td>

            <td>24</td>

        </tr>

    </table>

    <table id="tabDiv3">

        <tr>

            <td>ID</td>

            <td>姓名</td>

            <td>年龄</td>

        </tr>

        <tr>

            <td>0003</td>

            <td>王五</td>

            <td>24</td>

        </tr>

    </table>

    <button onclick="exp();">export to excel...</button>

</div>

</body>

<script>

    function exp(){

        tablesToExcel(['tabDiv1','tabDiv2','tabDiv3'], ['sheet1','sheet2','sheet3'], "testExport.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);

    }

</script>

</html>

js导出excel表格并生成多sheet的更多相关文章

js导出Excel表格
js导出Excel表格直接上代码: 红色部分:如果表格数据中有“1/1”这样的值,会在导出的Excel中转化为日期“1月1日”,所以才加上了红色那两句.如果返回值中没有这样的格式,红色部分可以不写. ...
html js 导出excel表格
这个使用js 导出excel,可以集成其他语言,可以html,php,asp ,java 等,自己喜欢用那种语言就用哪种,使用非常方便.js是使用tableExport.js ,jquery-3.2. ...
js导出excel表格中较长数字串会变成科学计数法问题
在做项目中,遇到导出excel表格时,银行账户号数字过长,导出的数字串变为计数法形式,如下图: 网上搜到解决方法,粘贴到这以供学习.不断更新. 原博地址:http://www.cnblogs.com/ ...
Html Table用JS导出excel格式问题导出EXCEL后单元格里的000412341234会变成412341234 7-14 会变成 2018-7-14(7月14) 自定义格式 web利用table表格生成excel格式问题 js导出excel增加表头、mso-number-format定义数据格式数字输出格式转换 mso-number-format:"\@"
Html Table用JS导出excel格式问题我在网上找的JS把HTML Tabel导出成EXCEL.但是如果Table里的数字内容为0开的的导成Excel后会自动删除0,我想以text的格式写入 ...
NPOI_winfrom导出Excel表格（二）(直接打开Excel软件，将数据填充在当前的sheet中)
//// 存储路径弹框选择 SaveFileDialog saveDialog = new SaveFileDialog(); saveDialog.DefaultExt = "xls&qu ...
ASP.NET Core 2.2 : 十六.扒一扒新的Endpoint路由方案 try.dot.net 的正确使用姿势 .Net NPOI 根据excel模板导出excel、直接生成excel .Net NPOI 上传excel文件、提交后台获取excel里的数据
ASP.NET Core 2.2 : 十六.扒一扒新的Endpoint路由方案 ASP.NET Core 从2.2版本开始,采用了一个新的名为Endpoint的路由方案,与原来的方案在使用上差别不 ...
PHP导入导出excel表格图片(转)
写excel的时候,我用过pear的库,也用过pack压包的头,同样那些利用smarty等作的简单替换xml的也用过,csv的就更不用谈了.呵呵.(COM方式不讲了,这种可读的太多了,我也写过利用wp ...
java中使用jxl导出Excel表格详细通用步骤
该方法一般接收两个参数,response和要导出的表格内容的list. 一般我们将数据库的数据查询出来在页面进行展示,根据用户需求,可能需要对页面数据进行导出. 此时只要将展示之前查询所得的数据放入s ...
使用NPOI将数据库里信息导出Excel表格并提示用户下载
使用NPOI进行导出Excel表格大家基本都会,我在网上却很少找到导出Excel表格并提示下载的简单的代码如下 //mvc项目可以传多个id以逗号相隔的字符串 public ActionResult ...

随机推荐

springboot整合shiro后报java.lang.ClassCastExcepting异常
最近搭一个springboot的框架,整合了shiro和redis,由于平常习惯用热部署,所以自然的引入了热部署的包,但是引入后报如下错误: 没错,这个问题害我搞了一天,后来删除热部署,项目正常的跑飞 ...
Java系列1 -- 浅谈面向对象
也许每一个计算机专业的人,在大学学习java的时候,老师开始时都会说这么一句话,"Java是一门面向对象的语言".那么面向对象到底是什么,他有什么好处,或者他比其他流行的语言C/C ...
Offcie2013 无法显示 Aurora解决方法
问题:安装Office2013和Aurora后,Word菜单栏中无Aurora 原因:aurora安装目录中缺失office.dll,word2013未加载COM文件office.dll和模板文件wo ...
Python eval 函数妙用
eval 功能:将字符串str当成有效的表达式来求值并返回计算结果. 语法: eval(source, globals, locals) -> value 参数: source:一个Python ...
删除外部dwg中指定的块定义
本例实现删除外部图纸中指定的块定义,在外部图纸当前模型空间中是没有该块定义的块参照存在. 代码如下: void CBlockUtil::DeleteBlockDefFormOtherDwg(const ...
BZOJ_1552_[Cerc2007]robotic sort_splay
BZOJ_1552_[Cerc2007]robotic sort_splay 题意: 分析: splay维护区间操作可以先把编号排序,给每个编号分配一个固定的点,映射过去查找编号的排名时先找到这个 ...
LoadRunner接口测试方法
实际上到目前为止,我所做过的几个关于性能测试的项目,都是在UI页面上能正常访问结束所有的前期功能测试而开始的性能测试.但loadrunner不仅仅只能靠录制回放修改脚本进行性能测试. 往往需要对发送报 ...
Java线程与Linux内核线程的映射关系
Linux从内核2.6开始使用NPTL (Native POSIX Thread Library)支持,但这时线程本质上还轻量级进程. Java里的线程是由JVM来管理的,它如何对应到操作系统的线程是 ...
centos7中输入ifconfig出现ens33，没有eth0
vmware安装的centos7中没有出现eth0网卡,也没有ip,不能上网,输入ifconfig后如下图解决办法 1.编辑网卡的配置文件 vi /etc/sysconfig/network-scr ...
【实战小项目】python开发自动化运维工具--批量操作主机
有很多开源自动化运维工具都很好用如ansible/salt stack等,完全不用重复造轮子.只不过,很多运维同学学习Python之后,苦于没小项目训练.本篇就演示用Python写一个批量操作主机的工 ...

js导出excel表格并生成多sheet

js导出excel表格并生成多sheet的更多相关文章

随机推荐

热门专题