zoukankan      html  css  js  c++  java
  • js导出带格式的表格(包括单元格合并,字体样式等)

    function HtmlExportToExcelForEntire() {
    			var uri = 'data:application/vnd.ms-excel;base64,',
    				template =
    				'<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>',
    				base64 = function(s) {
    					return window.btoa(unescape(encodeURIComponent(s)))
    				},
    				format = function(s, c) {
    					return s.replace(/{(w+)}/g, function(m, p) {
    						return c[p];
    					})
    				}
    			return (name, userList) => {
    				var tableTest = document.createElement('table');
    				tableTest.innerHTML = this.assemblyData(userList);
    				var ctx = {
    					worksheet: name || 'Worksheet',
    					table: tableTest.innerHTML
    				}
    				var alink = document.createElement('a');
    				alink.href = uri + base64(format(template, ctx));
    				alink.download = name + ".xls";
    				alink.style.display = 'none';
    				document.body.appendChild(alink);
    				alink.click();
    				alink.parentNode.removeChild(alink);
    			}
    		}
    
    		function assemblyData(data) {
    			var tHeader = `<tr>
    			<th>编号</th>
    			<th>负责人</th>
    			</tr>`;
    			var tBody = '';
    			for (var item of data) {
    				tBody += '<tr>'
    				tBody +=
    					`<td>${item.iid}</td>
    			<td>${item.assignee.name}</td>
    			`;
    				tBody += '</tr>'
    			}
    			var htmlData = tHeader + tBody;
    			return htmlData;
    		}
    

      调用方式:

    HtmlExportToExcelForEntire()('导出的表格名称',data);
  • 相关阅读:
    vue-cli3初尝试之路径别名配置
    nodejs之koa-router与koa-body搭配使用
    nodejs之crypto加密算法
    nodejs之glob与globby
    vuecli3初尝试(转载)
    python之线程同步
    python之多线程通信
    python之通过thread来实现多进程
    U盘启动盘安装Mac OS
    Windows环境下制作MACOS X U盘安装盘
  • 原文地址:https://www.cnblogs.com/wangyunhui/p/10369471.html
Copyright © 2011-2022 走看看