HTML页面中的表格导出为EXCEL文件

1、js文件准备 jquery.table2excel.js

下载地址 https://github.com/rainabba/jquery-table2excel
CSDN站内也多有该插件的下载提供

2、页面中引入js插件

<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.table2excel.js"></script>

3、定义table的css属性 生成导出按钮

<table class="table2excel">
	<tr>
		<th>生产厂家</th>
		<th>产品名称</th>
		<th>...</th>
		<th> class="noExl">操作</th>
	</tr>	
	<tr>
		<td>厂家1<td>
		<td>产品1<td>
		<td>...<td>
		<td class="noExl"><button>删除</button><button>修改</button><td>
	</tr>
		<tr>
		<td>厂家2<td>
		<td>产品2<td>
		<td>...<td>
		<td class="noExl"><button>删除</button><button>修改</button><td>
	</tr>
</table>
<table>
	<tr>
		<td>
			<input type="button" value="导出到excel中" class="btn btn-primary" onclick="table2Excel('出库信息明细.xls')"/>
		</td>
	</tr>
</table>

4、创建table2Excel(filename)方法

//filename 导出的excel文件名
//方法可带filename参数，亦可不带参数直接定义
function table2Excel(filename){
	$(".table2excel").table2excel({
		exclude: ".noExl",//class="noExl"的列不导出
		name: "Excel Document Name",
		filename: filename,//文件名称
		fileext: ".xls",//文件后缀名
		exclude_img: true,//导出图片
		exclude_links: true,//导出超链接
		exclude_inputs: true//导出输入框内容
	});
}

5、需要注意的点

我们的客户多为医院，浏览器基本上以XP和win7系统的ie为主，所以测试环境实在IE浏览器上进行的，最开始总是导出一个没有后缀的文件。由于有关于fileext的后缀名设置，所以也没有意识到是这方面的问题。直到一次测试中直接由导出按钮传递文件名称的参数时带上了.xls的后缀才成功导出正确的excel文件，在此标注，仅供参考