导出Excel/Pdf/txt/json/XML/PNG/CSV/SQL/MS-Word/ Ms-Powerpoint/等通过tableExport.js插件来实现
首先去我的云盘下载需要的js:
链接:https://pan.baidu.com/s/13vC-u92ulpx3RbljsuadWw
提取码:mo8m
页面代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>多种文件导出方法总结</title>
</head>
<body> <table id="cards_table" class="table table-striped table-bordered text-center table-hover dataTable no-footer"
style="width: 100%;" role="grid" aria-describedby="cards_table_info">
<thead>
<tr role="row">
<th class="text-center sorting_disabled" rowspan="1" colspan="1" aria-label="卡号">卡号</th>
<th class="text-center sorting_disabled" rowspan="1" colspan="1" aria-label="姓名">姓名</th>
<th class="text-center sorting_disabled" rowspan="1" colspan="1" aria-label="身份证号码">身份证号码</th>
<th class="text-center sorting_disabled" rowspan="1" colspan="1" aria-label="卡种">卡种</th>
<th class="text-center sorting_disabled" rowspan="1" colspan="1" aria-label="设备编号">设备编号</th>
<th class="text-center sorting_disabled" rowspan="1" colspan="1" aria-label="网点编号">网点编号</th>
<th class="text-center sorting_disabled" rowspan="1" colspan="1" aria-label="卡盘号">卡盘号</th>
<th class="text-center sorting_disabled" rowspan="1" colspan="1" aria-label="卡槽号">卡槽号</th>
<th class="text-center sorting_disabled" rowspan="1" colspan="1" aria-label="加卡日期">加卡日期</th>
<th class="text-center sorting_disabled" rowspan="1" colspan="1" aria-label="加卡时间">加卡时间</th>
<th class="text-center sorting_disabled" rowspan="1" colspan="1" aria-label="加卡柜员">加卡柜员</th>
</tr>
</thead>
<tbody>
<tr role="row" class="odd">
<td class="text-center sorting_1">6228231467695031768</td>
<td class=" text-center"></td>
<td class=" text-center">440682197705203224</td>
<td class=" text-center">成品银行卡</td>
<td class=" text-center">2000Y5</td>
<td class=" text-center">402880e95d0da971015d0dbaaac00008</td>
<td class=" text-center">4</td>
<td class=" text-center">11</td>
<td class=" text-center">2019-10-24</td>
<td class=" text-center">18:10:40</td>
<td class=" text-center">cardMaker</td>
</tr>
<tr role="row" class="even">
<td class="text-center sorting_1">6228231467695031768</td>
<td class=" text-center"></td>
<td class=" text-center">440682197705203224</td>
<td class=" text-center">成品银行卡</td>
<td class=" text-center">2000Y5</td>
<td class=" text-center">402880e95d0da971015d0dbaaac00008</td>
<td class=" text-center">4</td>
<td class=" text-center">12</td>
<td class=" text-center">2019-10-24</td>
<td class=" text-center">18:10:52</td>
<td class=" text-center">cardMaker</td>
</tr>
<tr role="row" class="odd">
<td class="text-center sorting_1">6228231467695031768</td>
<td class=" text-center"></td>
<td class=" text-center">440682197705203226</td>
<td class=" text-center">成品银行卡</td>
<td class=" text-center">2000Y5</td>
<td class=" text-center">402880e95d0da971015d0dbaaac00008</td>
<td class=" text-center">4</td>
<td class=" text-center">5</td>
<td class=" text-center">2019-10-23</td>
<td class=" text-center">23:10:08</td>
<td class=" text-center">cardMaker</td>
</tr>
<tr role="row" class="even">
<td class="text-center sorting_1">6228231467695031768</td>
<td class=" text-center"></td>
<td class=" text-center">440682197705203224</td>
<td class=" text-center">成品银行卡</td>
<td class=" text-center">2000Y5</td>
<td class=" text-center">402880e95d0da971015d0dbaaac00008</td>
<td class=" text-center">4</td>
<td class=" text-center">12</td>
<td class=" text-center">2019-11-12</td>
<td class=" text-center">11:11:59</td>
<td class=" text-center">cardMaker</td>
</tr>
<tr role="row" class="odd">
<td class="text-center sorting_1">6228231467695031768</td>
<td class=" text-center"></td>
<td class=" text-center">440682197705288888</td>
<td class=" text-center">成品银行卡</td>
<td class=" text-center">2000Y5</td>
<td class=" text-center">402880e95d0da971015d0dbaaac00008</td>
<td class=" text-center">4</td>
<td class=" text-center">12</td>
<td class=" text-center">2019-11-12</td>
<td class=" text-center">12:11:15</td>
<td class=" text-center">cardMaker</td>
</tr>
</tbody>
</table>
<button onclick="exportExcel()" >导出表格Excel</button>
<button onclick="exportCSV()" >导出表格csv</button>
<button onclick="exportStyleExcel()" >导出带有样式的Excel</button>
<button onclick="exportTxt()" >导出Txt</button>
<button onclick="exportJSON()" >导出JSON</button>
<button onclick="exportXML()" >导出XML</button>
<button onclick="exportSQL()" >导出SQL</button>
<button onclick="exportPDF()">导出PDF</button>
</body>
<!-- 这个是所有jquery插件的基础,首先第一个引入 -->
<script src="jquery-3.1.1.js"></script>
<!--PDF Export(导出Excel需要添加插件)
导出的格式可以是:如下
JSON
XML
PNG
CSV
TXT
SQL
MS-Word
Ms-Excel
Ms-Powerpoint
PDF-->
<!--base64,解析中文-->
<script src="jquery.base64.js"></script>
<script src="tableExport.js"></script>
<!--PNG Export(导出png需要添加插件)-->
<script type="text/javascript" src="html2canvas.js"></script>
<!--PDF Export(导出PDF需要添加插件)-->
<script type="text/javascript" src="jspdf/libs/sprintf.js"></script>
<script type="text/javascript" src="jspdf/jspdf.js"></script>
<script type="text/javascript" src="jspdf/libs/base64.js"></script>
<script>
//导出表格excel
function exportExcel() {
//导出按钮
$('#cards_table').tableExport({
type: 'excel',//将表导出的格式,这边为excel,也可以为txt/pdf/json/xml等
escape: 'false',
fileName: 'table',////设置导出的表的默认名称
worksheetName: 'worksheetName2',//工作页名称
tableName: 'tableName',//表格名称
ignoreColumn:'[5]'//表示忽略列数,在这表示把第6(5+1)列的数据给忽略掉,不在Excel中显示
})
}
//导出表格csv
function exportCSV() {
//导出按钮
$('#cards_table').tableExport({
type: 'csv',//将表导出的格式,这边为excel,也可以为txt/pdf/json/xml等
escape: 'false',
fileName: 'table',////设置导出的表的默认名称
worksheetName: 'worksheetName2',//工作页名称
tableName: 'tableName',//表格名称
ignoreColumn:'[5]'//表示忽略列数,在这表示把第6(5+1)列的数据给忽略掉,不在Excel中显示
})
}
//导出带有样式的表格
function exportStyleExcel() {
//导出按钮
$('#cards_table').tableExport({
type: 'excel',//将表导出的格式,这边为excel,也可以为txt/pdf/json/xml等
escape: 'false',
fileName: 'table',////设置导出的表的默认名称
worksheetName: 'worksheetName2',//工作页名称
tableName: 'tableName',//表格名称
ignoreColumn:'[5]',//表示忽略列数,在这表示把第6(5+1)列的数据给忽略掉,不在Excel中显示
excelstyles: ['red', 'color', 'font-weight', 'border']
})
}
//导出txt
function exportTxt() {
//导出按钮
$('#cards_table').tableExport({
type: 'txt',//将表导出的格式,这边为excel,也可以为txt/pdf/json/xml等
escape: 'false',
fileName: 'table',////设置导出的表的默认名称
worksheetName: 'worksheetName2',//工作页名称
tableName: 'tableName',//表格名称
ignoreColumn:'[5]'//表示忽略列数,在这表示把第6(5+1)列的数据给忽略掉,不在Excel中显示
})
}
//导出json
function exportJSON() {
//导出按钮
$('#cards_table').tableExport({
type: 'json',//将表导出的格式,这边为excel,也可以为txt/pdf/json/xml等
escape: 'false',
fileName: 'table',////设置导出的表的默认名称
worksheetName: 'worksheetName2',//工作页名称
tableName: 'tableName',//表格名称
ignoreColumn:'[5]'//表示忽略列数,在这表示把第6(5+1)列的数据给忽略掉,不在Excel中显示
})
}
//导出XML
function exportXML() {
//导出按钮
$('#cards_table').tableExport({
type: 'xml',//将表导出的格式,这边为excel,也可以为txt/pdf/json/xml等
escape: 'false',
fileName: 'table',////设置导出的表的默认名称
worksheetName: 'worksheetName2',//工作页名称
tableName: 'tableName',//表格名称
ignoreColumn:'[5]'//表示忽略列数,在这表示把第6(5+1)列的数据给忽略掉,不在Excel中显示
})
}
//导出SQL
function exportSQL() {
//导出按钮
$('#cards_table').tableExport({
type: 'sql',//将表导出的格式,这边为excel,也可以为txt/pdf/json/xml等
escape: 'false',
fileName: 'table',////设置导出的表的默认名称
worksheetName: 'worksheetName2',//工作页名称
tableName: 'tableName',//表格名称
ignoreColumn:'[5]'//表示忽略列数,在这表示把第6(5+1)列的数据给忽略掉,不在Excel中显示
})
}
//导出PDF:谷歌浏览器不支持
function exportPDF() {
//导出按钮
$('#cards_table').tableExport({
type: 'pdf',//将表导出的格式,这边为excel,也可以为txt/pdf/json/xml等
escape: 'false',
fileName: 'table',////设置导出的表的默认名称
worksheetName: 'worksheetName2',//工作页名称
tableName: 'tableName',//表格名称
ignoreColumn:'[5]'//表示忽略列数,在这表示把第6(5+1)列的数据给忽略掉,不在Excel中显示
})
}
</script>
</html>
补充:
TableExport插件依赖于jQuery(1.2.1+),FileSaver.js。为了支持.xlsx(Office Open XML SpreadsheetML Format)格式,你必须在 FileSaver.js 和 TableExport.js文件之前引入xlsx-core.js文件。为了使旧的浏览器(Firefox < 20, Opera < 15, Safari < 6)支持.xlsx,需要在 FileSaver.js 文件之前引入 Blob.js文件。
<script src="jquery.min.js"></script>
<script src="xlsx-core.js"></script>
<script src="blob.js"></script>
<script src="filesaver.js"></script>
<script src="tableexport.js"></script>
导出Excel/Pdf/txt/json/XML/PNG/CSV/SQL/MS-Word/ Ms-Powerpoint/等通过tableExport.js插件来实现的更多相关文章
- Python导出Excel为Lua/Json/Xml实例教程(一):初识Python
Python导出Excel为Lua/Json/Xml实例教程(一):初识Python 相关链接: Python导出Excel为Lua/Json/Xml实例教程(一):初识Python Python导出 ...
- Python导出Excel为Lua/Json/Xml实例教程(三):终极需求
相关链接: Python导出Excel为Lua/Json/Xml实例教程(一):初识Python Python导出Excel为Lua/Json/Xml实例教程(二):xlrd初体验 Python导出E ...
- Python导出Excel为Lua/Json/Xml实例教程(二):xlrd初体验
Python导出Excel为Lua/Json/Xml实例教程(二):xlrd初体验 相关链接: Python导出Excel为Lua/Json/Xml实例教程(一):初识Python Python导出E ...
- 导出jqgrid表格数据为EXCEL文件,通过tableExport.js插件。
今天公司项目需要做个导出功能,将jqgrid查询出的数据导出为EXCEL表格文件,期间遇到两个问题: 1.导出报错 uncaught exception: INVALID_CHARACTER_ERR: ...
- RDLC - 后台代码直接导出Excel/PDF/Word格式
最近做报表功能,用到了.net的报表组件rdlc. 其中有个功能就是后台代码直接输出Excel/PDF/Word格式的文件,网上看了些资源,做个总结: 参考地址 我直接贴出代码: //自动导出exce ...
- Word,Excel,pdf,txt等文件上传并提取内容
近期项目需求:1.要用到各种文件上传,下载. 2.并对文件进行搜索. 3.仅仅要文件里包括有搜索的内容,所有显示出来. 今天正好有时间整理一下,方便以后阅读,及对须要用到的朋友提供微薄之力.首先在实现 ...
- solr6.6 导入 文本(txt/json/xml/csv)文件
参照:solr6.6 导入 pdf文件 重点就是三个配置文件 1.建立的data-config.xml 内容如下: <dataConfig> <dataSource name=&qu ...
- 一个不错的能将HTML表格导出为excel,pdf等的jquery插件
https://github.com/kayalshri/tableExport.jquery.plugin https://github.com/kayalshri/ tableExport.jqu ...
- java中使用poi导入导出excel文件_并自定义日期格式
Apache POI项目的使命是创造和保持java API操纵各种文件格式基于Office Open XML标准(OOXML)和微软的OLE复合文档格式(OLE2)2.总之,你可以读写Excel文件使 ...
随机推荐
- 怎么提高U盘传输文件的性能?
U盘使用时间久了,其传输复制文件速度就可能会变得有些慢.出现这个问题的原因有很多,除了U盘本身的问题外,也可能会有电脑设置方面的因素在影响.好系统下面就来告诉大家解决U盘传输复制文件速度慢的几个小技巧 ...
- 6、SSH远程管理服务实战
1.SSH基本概述 SSH是一个安全协议,在进行数据传输时,会对数据包进行加密处理,加密后在进行数据传输.确保了数据传输安全.那SSH服务主要功能有哪些呢? 1.提供远程连接服务器的服务. 2.对传输 ...
- C++堆排序算法的实现
堆排序(Heap sort)是指利用堆这种数据结构所设计的一种排序算法.堆积是一个近似完全二叉树的结构,并同时满足堆积的性质:即子结点的键值或索引总是小于(或者大于)它的父节点.堆排序可以用到上一次的 ...
- python操作kafka实践
1.先看最简单的场景,生产者生产消息,消费者接收消息,下面是生产者的简单代码. ------------------------------------------------------------ ...
- UVA 1482 SG打表
打出SG表来可以很容易的发现i为偶数时 SG[i]=i/2 i为奇数时 SG[i]=SG[i/2] #include<bits/stdc++.h> typedef long long ll ...
- CeSharp支持MP4
因为CefSharp不支持MP4格式(因为版权问题,MP3因为版权过期新版本已经支持了),需要自己下载源码重新编译以支持MP4,或者下载被人编译好的库.因时间问题,我直接在csdn上下载了一个(1c币 ...
- 微软Blazor组件发布,DevExpress v19.1.8中可用:Charts新功能
点击获取DevExpress v19.2.3最新完整版试用下载 DevExpress UI for Blazor在v19.1.8中可用,此次更新发布包括DevExpress Blazor组件的主要功能 ...
- BZOJ 2157: 旅游 (树链剖分+线段树)
树链剖分后线段树维护区间最大最小值与和. 支持单点修改与区间取反. 直接写个区间取反标记就行了.线段树板题.(200行6000B+ 1A警告) #include <cstdio> #inc ...
- BZOJ 2119: 股市的预测 (Hash / 后缀数组 + st表)
转博客大法好 自己画一画看一看,就会体会到这个设置关键点的强大之处了. CODE(sa) O(nlogn)→1436msO(nlogn)\to 1436msO(nlogn)→1436ms #inclu ...
- 【51nod 1038】X^A Mod P
题目描述 X^A mod P = B,其中P为质数.给出P和A B,求< P的所有X. 例如:P = 11,A = 3,B = 5. 3^3 Mod 11 = 5 所有数据中,解的数量不超过Sq ...