jquery实现表格导出Excel
使用jQuery,jszip.js,FileSaver.js,excel-gen.js插件直接将网页中的table表格导出到本地Excel文件,而不需要经过后台。

导出结果:

实现步骤:
1.进入相关js插件
<script src="external/jquery-1.10.2.js"></script>
<script type="text/javascript" src="external/jszip.min.js"></script>
<script type="text/javascript" src="external/FileSaver.js"></script>
<script type="text/javascript" src="scripts/excel-gen.js"></script>
<script type="text/javascript" src="scripts/demo.page.js"></script>
2. 将HTML的table标签的id设置为test_table
<table class="table table-bordered table-striped" id="test_table">
<thead>
<tr>
<td>等级</td>
<td>姓名</td>
<td>城市</td>
<td>州</td>
<td>部门</td>
<td>选取</td>
<td>票数</td>
</tr>
</thead>
<tbody>
<tr>
<td>
<span>1</span>
</td>
<td>
<span>Small, Steve </span>
</td>
<td>
<span>New York</span>
</td>
<td>
<span>NY</span>
</td>
<td>
<span>Eastern</span>
</td>
<td>
<span>Metropolitan Region</span>
</td>
<td>
<span>378</span>
</td>
</tr>
<tr>
<td>
<span>2</span>
</td>
<td>
<span>Novello, Rodolfo </span>
</td>
<td>
<span>Lawrence</span>
</td>
<td>
<span>NY</span>
</td>
<td>
<span>Eastern</span>
</td>
<td>
<span>Long Island Region</span>
</td>
<td>
<span>223</span>
</td>
</tr> </tbody>
</table>
3.给按钮注册单击事件,导出Excel
$(document).ready(function () {
excel = new ExcelGen({
"src_id": "test_table",
"show_header": true
});
$("#generate-excel").click(function () {
excel.generate();
});
});
本例源码下载:
链接:https://pan.baidu.com/s/13sAXqB3cwu7h-jdOiTnkHQ
提取码:2bbn
jquery实现表格导出Excel的更多相关文章
- vue+iview中的table表格导出excel表格
一.iveiw框架中table中有exportCsv()方法可以导出.csv后缀文件,类似于excel文件,但是并不是excel文件. 二.实现table表格导出excel文件利用Blob.js 和 ...
- html table表格导出excel的方法 html5 table导出Excel HTML用JS导出Excel的五种方法 html中table导出Excel 前端开发 将table内容导出到excel HTML table导出到Excel中的解决办法 js实现table导出Excel,保留table样式
先上代码 <script type="text/javascript" language="javascript"> var idTmr; ...
- Jquery easyui datagrid 导出Excel
From:http://www.cnblogs.com/weiqt/articles/4022399.html datagrid的扩展方法,用于将当前的数据生成excel需要的内容. 1 <sc ...
- [ExtJS5学习笔记]第三十三节 sencha extjs 5 grid表格导出excel
使用extjs肯定少不了使用表格控件,用到表格,领导们(一般)还是惯于使用excel看数据,所以用到extjs表格的技术猿们肯定也会有导出表格excel这一个需求,本文主要针对如何在用extjs将gr ...
- 前端实现table表格导出excel
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- vue+element 表格导出Excel文件
https://www.cnblogs.com/bobodeboke/p/8867481.html 非常感谢 这个大佬 才让我搞到了Blob.js 和 Export2Excel.js 如果最后运行时 ...
- html表格导出Excel的一点经验心得
最近在做统计功能,要求统计结果(表格)既能查看(BS系统,在浏览器查看),又能输出为excel文件.对于输出excel文件,在网上找到n种方案,因为还需查看,最终选择了统计结果输出为table,查看时 ...
- Element-ui组件库Table表格导出Excel表格
安装npm install --save xlsx file-saver 两个插件的详细地址在下面 https://github.com/SheetJS/js-xlsxhttps://github.c ...
- html表格导出Excel的实例
1. 拼成出完整的HMTL的Table代码片段后,转成二进制byte[]类型并存入数据库中,供下载时调出来使用. System.Text.StringBuilder sb = new StringBu ...
- Jquery ajax请求导出Excel表格
直接贴代码吧 $("#btn-export").click(function(){ var exportExcel = "export_excel"; data ...
随机推荐
- linux 系统安全和应用
目录 一.系统安全 二.账号安全 三.修改密码生效时间 四.强制下次登录成功时修改密码 五.历史命令 六.终端自动注销 七.wheel组 八.grub菜单密码 一.系统安全 原因:1.系统数据想要保护 ...
- 【编程日记】搭建PyCharm集成开发环境
0.相关确定 本教程使用的版本号为专业版PyCharm 2022.3.2,如果您是初学者,为了更好的学习本教程,避免不必要的麻烦,请您下载使用与本教程一致的版本号. 1.PyCharm的下载 官网下载 ...
- 【RocketMQ】NameServer总结
NameServer是一个注册中心,提供服务注册和服务发现的功能.NameServer可以集群部署,集群中每个节点都是对等的关系(没有像ZooKeeper那样在集群中选举出一个Master节点),节点 ...
- ODOO13之六:Odoo 13开发之模型 – 结构化应用数据
在本系列文章第三篇Odoo 13 开发之创建第一个 Odoo 应用中,我们概览了创建 Odoo 应用所需的所有组件.本文及接下来的一篇我们将深入到组成应用的每一层:模型层.视图层和业务逻辑层. 本文中 ...
- qq飞车端游最全按键指法教学
目录 起步篇 超级起步 弹射起步 段位起步 基础篇 点飘 撞墙漂移 撞墙点喷 进阶篇 双喷 叠喷 断位漂移 段位双喷 侧身漂移 快速出弯 CW WCW CWW 牵引 甩尾点飘 甩尾漂移 右侧卡 左侧卡 ...
- 浅谈 ByteHouse Projection 优化实践
预聚合是 OLAP 系统中常用的一种优化手段,在通过在加载数据时就进行部分聚合计算,生成聚合后的中间表或视图,从而在查询时直接使用这些预先计算好的聚合结果,提高查询性能,实现这种预聚合方法大多都使用物 ...
- Hive执行计划之一文读懂Hive执行计划
目录 概述 1.hive执行计划的查看 2.学会查看Hive执行计划的基本信息 3.执行计划步骤操作过程 4.explain extended 概述 Hive的执行计划描述了一个hiveSQL语句的具 ...
- HTTP请求的几种方式
1.HTTP请求简介[1] HTTP(Hypertest Transfer Protocol)是用于传输像HTML这样的超文本文件的应用层协议.它被设计用于WEB浏览器端和WEB服务端的交互,但也有其 ...
- 【python基础】复杂数据类型-字典(嵌套)
有时候,需要将一系列字典存储在列表中,或将列表作为值存储在字典中,这称为嵌套.我们可以在列表中嵌套字典.在字典中嵌套列表.在字典中嵌套字典. 1.列表嵌套字典 我们可以把一个人的信息放在字典中,但是多 ...
- JavaScript学习笔记 - 语法篇 - 一句废话没有版
写在前面: 绝不废话!放心食用 JavaScript语法很简单,可以直接在控制台调试理解 目录 1.变量和常量 2.数据类型 3.字符串 3.1 模板字符串 3.2 字符串的部分常用函数 4.数组 5 ...