基于jQuery的前端导出插件tableExport，导出成xlsx, xls, csv, txt文件示例
tableExport是一款可将前端HTML table数据导出成 xlsx, xls, csv和 txt文件格式的jQuery插件，支持Bootstrap，支持自定义，简单易用。本文将简单介绍如何使用tableExport并提供该插件导出数据示例。
入门指南
使用教程
1、引入依赖
<link href="js/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<link href="js/tableexport/dist/css/tableexport.css" rel="stylesheet" type="text/css">
<script src="js/jquery/3.3.1/jquery.min.js"></script>
<script src="js/FileSaver.min.js"></script>
<script src="js/Blob.min.js"></script>
<script src="js/xls.core.min.js"></script>
<script src="js/tableexport/dist/js/tableexport.min.js"></script>
2、HTML表格
<table class="table table-striped table-bordered" data-name="cool-table">
<thead>
<tr>
<th>水果排名</th>
<th>水果名称</th>
<th>数量</th>
<th>百分比</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>橙子</td>
<td>1,370,000个</td>
<td>28.9%</td>
</tr>
<tr>
<td>2</td>
<td>苹果</td>
<td>1,273,000个</td>
<td>17.6%</td>
</tr>
<tr>
<td>3</td>
<td>香蕉</td>
<td>321,000个</td>
<td>16.43%</td>
</tr>
<tr>
<td>4</td>
<td>猕猴桃</td>
<td>255,610,70个</td>
<td>21.52%</td>
</tr>
<tr>
<td>5</td>
<td>西瓜</td>
<td>204,503,000</td>
<td>19.82%</td>
</tr>
<tr>
<td>6</td>
<td>哈密瓜</td>
<td>190,56,0个</td>
<td>28.62%</td>
</tr>
<tbody>
</table>
3、Javascript脚本初始化
//自定义导出按钮显示文字，全局方式
TableExport.prototype.formatConfig.xlsx.buttonContent = "导出成xlsx";
TableExport.prototype.formatConfig.xls.buttonContent = "导出成xls";
TableExport.prototype.formatConfig.csv.buttonContent = "导出成csv";
TableExport.prototype.formatConfig.txt.buttonContent = "导出成txt";
//初始化
$("table").tableExport({
formats: ["xlsx","xls", "csv", "txt"], //定义可导出文件格式
filename:"水果库存", //导出文件名称
bootstrap:true //设置支持bootstrap样式
});
这样就完成了tableexport将table数据导出成xlsx,xls,csv,txt文件的示例。
the end
