有时候的需求是从后台获取数据,然后将数据变成execl,进行导出,下载成execl 解决的方法是

一,比较方便的是

这有个插件 可以直接用

https://www.npmjs.com/package/xlsx

二,这种是自己写的一种

1.渲染数据的模板

<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel"
xmlns="http://www.w3.org/TR/REC-html40">
<head>
<meta charset="utf-8" />
<!--[if gte mso 9]>
<xml>
<x:ExcelWorkbook>
<x:ExcelWorksheets>
<x:ExcelWorksheet>
<x:Name><%=sheetName%></x:Name>
<x:WorksheetOptions>
<x:DisplayGridlines/>
</x:WorksheetOptions>
</x:ExcelWorksheet>
</x:ExcelWorksheets>
</x:ExcelWorkbook>
</xml><![endif]-->
</head>
<body><%=tableHTML%>
</body>
</html>

2.点击导出execl 点击导出按钮 然后执行这个函数

// 导出文件
clickExport : function(event) {
var _this=this;
this.renderTable(function(){
// 获取当前的图表类型
var type = 'table';
// sheet名称
var sheetName = '专利信息汇总表 ';
if (type == "table") {
_this.exportExcel(sheetName, _this.$(".execltable").find("table"), event);
}
});
},
// 导出为excel文件
exportExcel : function(sheetName, $table, event) {
var base64 = window.btoa(unescape(encodeURIComponent(this.tableExcelTemplate({
sheetName : sheetName,
tableHTML : $table.prop("outerHTML")
}))));
// 获取下载链接
var uri = 'data:application/vnd.ms-excel;base64,' + base64;
// 设置下载名称
event.target.download = sheetName + ".xls";
// 触发下载
event.target.href = uri;
},
renderTable:function(callback){
var result=this.tableView.getDataExecl();
this.$(".execltable").html(this.tableTemplate({
rows:result
}));
callback();
},

  

 

将表格table作为execl导出的更多相关文章

  1. 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的格式写入 ...

  2. vue中excal表格的导入和导出

    注意:vue中要实现表格的导入与导出,首先要install两个依赖, npm install -S file-saver xlsx  和  npm install -D script-loader.其 ...

  3. jQuery动态对表格Table进行添加或删除行以及修改列值操作

    jQuery,不仅可以以少量的代码做很多操作,而且兼容性好(各种浏览器,各种版本). 下面用jQuery动态对表格Table进行添加或删除行以及修改列值操作 1.jQuery代码 <script ...

  4. BootStrap入门教程 (二) :BASE CSS(排版(Typography),表格(Table),表单(Forms),按钮(Buttons))

    上讲回顾:Bootstrap的手脚架(Scaffolding)提供了固定(fixed)和流式(fluid)两种布局,它同时建立了一个宽达940px和12列的格网系统. 基于手脚架(Scaffoldin ...

  5. html表格table设置边框

    对于很多初学HTML的人来说,表格<table>是最常用的标签了,但对于表格边框的控制,很多初学者却不甚其解. 一般我们用表格的时候总会给它个border属性,比如:<table b ...

  6. css列表list、表格table

    列表list,无序列表ul,有序列表ol 1.列表项样式list-style-type 无列表默认为dist实心圆,有序列表默认为decimal阿拉伯数字(前面不带0) 其他无序列表常用none无样式 ...

  7. 表格(Table)隔行变色

    在ASP.NET的Repeater控件,实现隔行变色,是极简单的事情.因为它有ListItemType.Item和ListItemType.AlternatingItem模版.如果在普通的表格(Tab ...

  8. pre,html转义,abbr缩写,表格table

    <pre></pre>预定义文本标签pre(保留换行和空格) <sdds>对html转义 <abbr title="sddsdsds"&g ...

  9. 表格Table宽度设置无效的解决方法

    表格Table宽度设置无效的解决方法 bootstrap中使用table时发现不管用width赋值方式都无法改变table>td的宽度 解决方法: 设置table:table-layout:fi ...

随机推荐

  1. C# 写 LeetCode easy #28 Implement strStr()

    28.Implement strStr() Implement strStr(). Return the index of the first occurrence of needle in hays ...

  2. Socket通信常见问题

    1.检查服务器防火墙入站规则,是否允许对应端口通过.如果是云服务器,还需要通过对应账户去设置安全规则 2.服务端监听或绑定端口时,最好使用IPAddress.Any监听所有网口的改端口,创建socke ...

  3. SPI编程

    #include <stdio.h>#include <wiringPi.h>#include <wiringPiSPI.h> int main(void){ un ...

  4. Note: PANOPLY: Low-TCB Linux Applications with SGX Enclaves

    PANOPLY provides middleware for SGX and Linux operating systems. What PANOPLY provides middleware fo ...

  5. mysql的性能优化总结

    经验是从别人那里拿来的,不想直接复制黏贴,想亲自总结下,巴拉巴拉.........进入正题吧 一.为查询加入缓存 1.检查数据库是否开启缓存:show variables like '%query_c ...

  6. OpenStack基础知识-tox的详解介绍

    1.tox简介 tox是通用的虚拟环境管理和测试命令行工具.tox能够让我们在同一个Host上自定义出多套相互独立且隔离的python环境,每套虚拟环境中可能使用了不同的 Python 拦截器/环境变 ...

  7. [笔记]解决git本地仓库不能上传到gitee远程仓库的问题

    关键词:git.gitee.码云.上传远程仓库失败 1.gitee有一个远程仓库名字是CommandModel,里面只有两个README文件 2.假如我目录  D:\eclipse\workspace ...

  8. 机房重构——泛型和“DataTable”

    前言 我们都知道在机房重构的时候,大多数都在用七层进行重构,每一层都依赖实体.所以不管怎么调用,返回的应该是实体参数,这样才符合大多数的逻辑,这样我们试想一下,如果我们要求在U层返回多个实体值,怎么办 ...

  9. Oracle表连接(转)

    表之间的连接 Join是一种试图将两个表结合在一起的谓词,一次只能连接2个表,表连接也可以被称为表关联.在后面的叙述中,我们将会使用”row source”来代替”表”,因为使用row source更 ...

  10. day16正则表达式作业详解

    1.正则表达式练习题 点击查看详细内容 作业的讲解 1.匹配整数或者小数(包括正数和负数) -?\d+.\d+|-?\d+ -?\d+(\.\d+)? 2.匹配年月日日期 格式2018-12-6 #找 ...