前端JS脚本将网页表格导出为Excel
话不多说,上代码!
<!DOCTYPE>
<html>
<head>
<title>Excel Test</title>
</head> <body>
<div style="width:100%;padding:40px;">
Excel Test
</div>
<table id="excel">
<tr>
<td>Name</td>
<td>Age</td>
<td>Gender</td>
</tr>
<tr>
<td>Young</td>
<td>24</td>
<td>Male</td>
</tr>
<tr>
<td>Even</td>
<td>23</td>
<td>Female</td>
</tr>
<tr>
<td>Leon</td>
<td>25</td>
<td>Male</td>
</tr>
</table>
</body>
<div style="width:200px;margin:auto;text-align:center;">
<button onclick="ok()">导出</button>
</div> <script>
var ok = (function () {
var uri = 'data:application/vnd.ms-excel;base64,',
template = '<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><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{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) {
var tables = document.getElementById('excel');
var ctx = { worksheet: name || 'Worksheet', table: tables.innerHTML }
window.location.href = uri + base64(format(template, ctx));
}
})(); function ExportSupplierMonthlyData() {
try {
tableToExcel();
} catch (err) {
bootbox.alert('没有数据,导出失败');
}
}
</script>
</html>
前端JS脚本将网页表格导出为Excel的更多相关文章
- 网站开发进阶(二十五)js如何将html表格导出为excel文件
js如何将html表格导出为excel文件 赠人玫瑰,手留余香.若您感觉此篇博文对您有用,请花费2秒时间点个赞,您的鼓励是我不断前进的动力,共勉! jsp页面数据导出成excel的方法很 ...
- 网站开发进阶(三十一)js如何将html表格导出为excel文件(后记)
js如何将html表格导出为excel文件(后记) 前言 项目前期做了个导出Excel表格的功能,但是经过测试发现只有在IE上才可以正确实现,在Chrome等浏览器中无法实现导出效果.经过上网搜索,尝 ...
- 纯JS 将table表格导出到excel
html <div > <button type="button" onclick="getXlsFromTbl('tableExcel','myDiv ...
- 利用 JS 脚本实现网页全自动秒杀抢购
利用 JS 脚本实现网页全自动秒杀抢购 倒计时页面: 倒计时未结束时,购买按钮还不能点击. 结束时,可以点击购买,点击后出现提示"付款成功" 展示效果 1.制作测试网页 首先我们来 ...
- JS 将页面上的表格导出为 Excel 文件
如果在页面上展示了一个表格,想把这个表格导出为Excel文件,那么在要求不高的情况下,可以直接利用 JavaScript 的 Blob 和 Object URL 特性将表格导出.不过,这就是利用了 E ...
- vue将表格导出为excel
vue将表格导出为excel 一:在项目中需要安装2个依赖项,如下命令: npm install --save file-saver xlsx 二:在vue文件中如下使用即可: <templat ...
- 使用JavaScript把页面上的表格导出为Excel文件
如果在页面上展示了一个数据表格,而用户想把这个表格导出为Excel文件,那么在要求不高的情况下,可以不通过服务器生成表格,而是直接利用JavaScript的Blob和Object URL特性将表格导出 ...
- 使用js代码将HTML Table导出为Excel
使用js代码将HTML Table导出为Excel的方法: 直接上源码 <html> <head> <meta http-equiv="Content-Type ...
- 表格导出到excel的样式消失该如何修改
工作中遇到一需求,要将后台的表格导出到excel后的表格样式该如何修改呢? 其实表格导出首先需要了解两个插件:jquery.table2excel.js和tableExport.js 1.第一步,写一 ...
随机推荐
- 【Heap-dijkstra】CDOJ1639 云中谁寄锦书来?雁字回时,月满西楼。
题意: 在n个点m条边的无向图上,有k个出口 从起点出发,每到一个点(包括起点),该点连出的边中有d条会被封锁 求最坏情况下到达出口的最短路 题解: 该题为dijkstra算法的拓展 由于求最坏情况下 ...
- [转]Spring Security 可动态授权RBAC权限模块实践
RBAC:基于角色的访问控制(Role-Based Access Control) 先在web.xml 中配置一个过滤器(必须在Struts的过滤器之前) <filter> <fil ...
- hdu 5236 Article 概率dp
Article Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.hdu.edu.cn/showproblem.php?pid=5236 ...
- Xcode 6.4项目中的常见文件(info.plist)
Xcode 6.4项目中的常见文件(info.plist) 代码中获取 info.plist[NSBundle mainBundle] infoDictionary]; Bundle display ...
- FeignClient与RestTemplate的区别比较简单研究
题外:个人觉得可能还没达到那种境界,还体会不到真正的实质性区别,就好比用HttpClient可以实现的用FeignClient同样可以实现,反之也是. JAVA 项目中接口调用怎么做 ? Httpcl ...
- POJ 2079 Triangle(凸包+旋转卡壳,求最大三角形面积)
Triangle Time Limit: 3000MS Memory Limit: 30000K Total Submissions: 7625 Accepted: 2234 Descript ...
- 推荐一篇讲arm架构gcc内联汇编的文章
这是来自ethernut网站的一篇文章,原文链接: http://www.ethernut.de/en/documents/arm-inline-asm.html 另外,据说nut/os是个不错的开源 ...
- tomcat配置优化
tomcat服务管理页面 http://192.168.1.249:8080/manager/status 找到下面的内容 "http-nio-8081" (此处端口是根据自己实 ...
- mydate97的时间格式设置
<script type="text/javascript" src="./WdatePicker.js"></script> < ...
- Spring与Quartz的整合
Quartz Quartz是一个完全由Java编写的开源作业调度框架,为在Java应用程序中进行作业调度提供了简单却强大的机制.Quartz允许开发人员根据时间间隔来调度作业.它实现了作业和触发器的多 ...