您的位置：首页 > Web前端 > HTML

html中的table导出Excel

2016-07-29 11:06 405 查看

演示地址：

http://www.jq22.com/yanshi3312

具体代码：

<!DOCTYPE html>
<html lang="zh-CN">

<head>
<meta charset="UTF-8">
<title>table export</title></head>
<body>
<table id="table1">
<tbody>
<tr>
<td>文字1</td>
<td>咨询</td>
<td>测试</td></tr>
<tr>
<td>文字1</td>
<td>咨询</td>
<td>测试</td></tr>
<tr>
<td>文字1</td>
<td>咨询</td>
<td>测试</td></tr>
<tr>
<td>文字1</td>
<td>咨询</td>
<td>测试</td></tr>
<tr>
<td>文字1</td>
<td>咨询</td>
<td>测试</td></tr>
<tr>
<td>文字1</td>
<td>咨询</td>
<td>测试</td></tr>
</tbody>
</table>
<table id="table2">
<thead>
<tr>
<td>标题一</td>
<td>标题二</td>
<td>标题三</td></tr>
</thead>
<tbody>
<tr>
<td>
<a href="#" target="_blank">文字2</a></td>
<td>咨询</td>
<td>测试</td></tr>
<tr>
<td>
<a href="#" target="_blank">文字2</a></td>
<td>咨询</td>
<td>测试</td></tr>
<tr>
<td>
<a href="#" target="_blank">文字2</a></td>
<td>咨询</td>
<td>测试</td></tr>
<tr>
<td>
<a href="#" target="_blank">文字2</a></td>
<td>咨询</td>
<td>测试</td></tr>
<tr>
<td>
<a href="#" target="_blank">文字2</a></td>
<td>咨询</td>
<td>测试</td></tr>
<tr>
<td>
<a href="#" target="_blank">文字2</a></td>
<td>咨询</td>
<td>测试</td></tr>
</tbody>
</table>
<div id="export">
<a data-type="json" href="javascript:;">导出json</a>
<a data-type="txt" href="javascript:;">导出txt</a>
<a data-type="csv" href="javascript:;">导出csv</a>
<a data-type="xls" href="javascript:;">导出excel</a>
<a data-type="doc" href="javascript:;">导出word</a></div>
<script src="Blob.js"></script>
<script src="FileSaver.js"></script>
<script src="tableExport.js"></script>
<script>var $exportLink = document.getElementById('export');
$exportLink.addEventListener('click',
function(e) {
e.preventDefault();
if (e.target.nodeName === "A") {
tableExport('table1', '测试测试', e.target.getAttribute('data-type'))
}
},
false);</script>
</body>
</html>

源码下载：

http://files.cnblogs.com/files/gguozhenqian/Demo.rar

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航