HTML转Excel，并实现打印，下载功能

互联网 18-6-11
<html>  	<head> 		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 		 	</head>  	<body link="blue" vlink="purple"> 		<table id="print-content" border="1" cellpadding="0" cellspacing="0" style='border-collapse:collapse;table-layout:fixed;'> 			<colgroup> 				<col width="80 "> 				<col width="80 "> 				<col width="150 "> 				<col width="80 "> 				<col width="150 "> 				<col width="80 "> 				<col width="80 "> 			</colgroup> 			<tr height="20" style="text-align: center;font-size:18px"> 				<td colspan="7">会签单</td> 			</tr> 			<tr height="20" style="text-align: center;font-size:14px"> 				<td></td> 				<td colspan="2">流转</td> 				<td></td> 				<td colspan="3">会议</td> 			</tr> 			<tr height="20" style="text-align: center;font-size:14px"> 				<td>名称</td> 				<td colspan="2">自动获取</td> 				<td>编号</td> 				<td colspan="3">自动获取</td> 			</tr> 			<tr height="20" style="text-align: center;font-size:14px"> 				<td>主持</td> 				<td colspan="2">自动获取</td> 				<td>类型</td> 				<td colspan="3">自动获取</td> 			</tr> 			<tr height="20" style="text-align: center;font-size:14px"> 				<td>人</td> 				<td colspan="2">自动获取</td> 				<td>日期</td> 				<td colspan="3">自动获取</td> 			</tr> 			<tr height="100" style="text-align: center;font-size:14px"> 				<td rowspan="5">内容</td> 				<td colspan="6" rowspan="5">自动获取</td> 			</tr> 			<tr/> 			<tr/> 			<tr/> 			<tr/> 			<tr height="20" style="text-align: center;font-size:14px"> 				<td>备注</td> 				<td colspan="6">自动获取</td> 			</tr> 			<tr height="24" style="text-align: center;font-size:16px"> 				<td colspan="7">意见</td> 			</tr> 			<tr height="24" style="text-align: center;font-size:14px"> 				<td>序号</td> 				<td>人</td> 				<td>部门</td> 				<td>意见</td> 				<td>时间</td> 				<td>节点</td> 				<td>状态</td> 			</tr> 			<tr height="20" style="text-align: center;font-size:14px"> 				<td>1</td> 				<td>顾</td> 				<td>办公室</td> 				<td>同意！</td> 				<td>2018/5/14 15:21</td> 				<td></td> 				<td>已提交</td> 			</tr> 		</table> 		<!-- 下载方法1.超链接_导出文件--> 		<a id="print-click">超链接_导出表格</a> 		<!-- 下载方法2.引入文件保存js--> 		<input type="button" onclick="download()" value="函数_导出表格"></input> 		<input type="button" onclick="printout()" value="打印"></input> 		<!-- 下载方法2.引入文件保存js--> 		<script type="application/javascript" src="js/FileSaver.js" ></script> 		<script> 			// 使用outerHTML属性获取整个table元素的HTML代码（包括<table>标签），然后包装成一个完整的HTML文档，设置charset为urf-8以防止中文乱码 			var html = "<html><head><meta charset='utf-8' /></head><body>" + document.getElementById("print-content").outerHTML + "</body></html>"; 			// 实例化一个Blob对象，其构造函数的第一个参数是包含文件内容的数组，第二个参数是包含文件类型属性的对象 			var blob = new Blob([html], { 				type: "application/vnd.ms-excel" 			}); 			var a = document.getElementById("print-click"); 			// 利用URL.createObjectURL()方法为a元素生成blob URL 			a.href = URL.createObjectURL(blob); 			// 设置文件名，目前只有Chrome和FireFox支持此属性 			a.download = "会签单.xls";  			function download() { 				debugger 					// 使用outerHTML属性获取整个table元素的HTML代码（包括<table>标签），然后包装成一个完整的HTML文档，设置charset为urf-8以防止中文乱码 					var html2 = "<html><head><meta charset='utf-8' /></head><body>" + document.getElementById("print-content").outerHTML + "</body></html>"; 					// 实例化一个Blob对象，其构造函数的第一个参数是包含文件内容的数组，第二个参数是包含文件类型属性的对象 					var blob2 = new Blob([html2], { 						type: "application/vnd.ms-excel" 					}); 					saveAs(blob2, "应系单.xls"); 			}; 			  //打印具体实现代码            function printout() {            		debugger;                 var newWindow;                 //打开一个新的窗口                   newWindow = window.open();                 // 是新窗口获得焦点                   newWindow.focus();                 //保存写入内容                   var newContent = "<html><head><meta charset='utf-8'/><title>打印</title></head><body>"                 newContent += document.getElementById("print-content").outerHTML;                 newContent += "</body></html>"                 // 将HTML代码写入新窗口中                   newWindow.document.write(newContent);                 newWindow.print();                 // close layout stream                  newWindow.document.close();                 //关闭打开的临时窗口                 newWindow.close();                 return false;            }; 		</script> 	</body>  </html>
HTML转Excel，并实现打印，下载功能

相关资讯

标签推荐
