javascript 将table导出 Excel ,可跨行跨列
原文地址:https://www.cnblogs.com/hailexuexi/p/10795887.html
<script language="JavaScript" type="text/javascript">//jQuery HTML导出Excel文件(兼容IE及所有浏览器)function HtmlExportToExcel(tableid,file_name) {var filename =file_name; //'Book'if (getExplorer() == 'ie' || getExplorer() == undefined) {HtmlExportToExcelForIE(tableid, filename);}else {HtmlExportToExcelForEntire(tableid, filename)}}//IE浏览器导出Excelfunction HtmlExportToExcelForIE(tableid, filename) {try { var curTbl = document.getElementById(tableid); var oXL; try{ oXL = new ActiveXObject("Excel.Application"); //创建AX对象excel }catch(e){ alert("无法启动Excel!\n\n如果您确信您的电脑中已经安装了Excel,"+"那么请调整IE的安全级别。\n\n具体操作:\n\n"+"工具 → Internet选项 → 安全 → 自定义级别 → 对没有标记为安全的ActiveX进行初始化和脚本运行 → 启用"); return false; } var oWB = oXL.Workbooks.Add(); //获取workbook对象 var oSheet = oWB.ActiveSheet;//激活当前sheet var sel = document.body.createTextRange(); sel.moveToElementText(curTbl); //把表格中的内容移到TextRange中 try{sel.select(); //全选TextRange中内容 }catch(e1){e1.description}sel.execCommand("Copy");//复制TextRange中内容 oSheet.Paste();//粘贴到活动的EXCEL中 oXL.Visible = true; //设置excel可见属性 var fname = oXL.Application.GetSaveAsFilename(filename+".xls", "Excel Spreadsheets (*.xls), *.xls"); oWB.SaveAs(fname); oWB.Close(); oXL.Quit(); } catch (e) {alert(e.description);}}//非IE浏览器导出Excelvar HtmlExportToExcelForEntire = (function() {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 function(table, name) {if (!table.nodeType) { table = document.getElementById(table); }var ctx = { worksheet: name || 'Worksheet', table: table.innerHTML }document.getElementById("dlink").href = uri + base64(format(template, ctx));document.getElementById("dlink").download = name + ".xls";document.getElementById("dlink").click();}})()function getExplorer() {var explorer = window.navigator.userAgent;//ie if (explorer.indexOf("MSIE") >= 0) {return 'ie';}//firefox else if (explorer.indexOf("Firefox") >= 0) {return 'Firefox';}//Chromeelse if (explorer.indexOf("Chrome") >= 0) {return 'Chrome';}//Operaelse if (explorer.indexOf("Opera") >= 0) {return 'Opera';}//Safarielse if (explorer.indexOf("Safari") >= 0) {return 'Safari';}}
</script>
页面代码
<table id="table2">
<tr>
<td>标题一</td>
<td>标题二</td>
<td>标题三</td>
</tr>
<tr>
<td rowspan="2">文字</td>
<td>咨询</td>
<td>测试</td>
</tr>
<tr>
<td>咨询</td>
<td>测试</td>
</tr>
<tr>
<td>文字</td>
<td>咨询</td>
<td>测试</td>
</tr>
<tr>
<td>文字</td>
<td>咨询</td>
<td>测试</td>
</tr>
<tr>
<td>文字</td>
<td>咨询</td>
<td>测试</td>
</tr>
<tr>
<td>文字</td>
<td>咨询</td>
<td>测试</td>
</tr></table>
<!-- 必须要有这个A标签,不然会报错-->
<a id="dlink"></a><script>function exportExcel(){HtmlExportToExcel('table2','Book');}
</script>
标题一 | 标题二 | 标题三 |
文字 | 咨询 | 测试 |
咨询 | 测试 | |
文字 | 咨询 | 测试 |
文字 | 咨询 | 测试 |
文字 | 咨询 | 测试 |
文字 | 咨询 | 测试 |
导出截图展示:
javascript 将table导出 Excel ,可跨行跨列相关推荐
- Table表格字段居中,跨行跨列
1.整个表格字段居中 <table id="contentTable" style="text-align: center;"> </tab ...
- 页面table导出Excel——table2excel
1.下载table2Excel插件,https://github.com/rainabba/jquery-table2excel 2.引入js <script type="text/j ...
- html跨行跨列学生报名表,HTML表格跨行、跨列操作(rowspan、colspan)
一般使用 元素的colspan属性来实现单元格跨列操作,使用元素的rowspan属性来实现单元格的跨行操作. colspan属性规定单元格可横跨的列数,所有浏览器都支持colspan属性.其取值为nu ...
- 压缩包里面excel 导出 (跨行跨列)
压缩包里面excel 导出 (跨行跨列) 创建好 excel模板 直接读取内容即可的方法 1. List content = new ArrayList(); InputStream istream ...
- java使用poi读取跨行跨列excel
java使用poi读取跨行跨列excel 1.需求背景 2.实现思路分析 3.重要代码片码说明 4.完整的代码类如下: 5.完整的demo代码提供如下 6.demo执行结果 1.需求背景 最近有一个工 ...
- table同时实现跨行跨列
table同时实现跨行跨列的效果: HTML代码如下: <div id="app"><table cellpadding="0" cellsp ...
- table标签、表格的跨行跨列、ifarme标签
table标签 需求: 制作一个带表头的三行山列的表格,并显示边框:修改表格的宽度.高度.表格的对齐方式.单元格间距. <!DOCTYPE html> <html lang=&quo ...
- HTML table跨行跨列
HTML table跨行跨列 table读取 读取时,表格行数与列数都已经确定,且每行单元格个数相同,每列单元格个数也相同. 跨行跨列时,相应的单元格就要多占行单元格的位置和列单元格的位置. 跨行 跨 ...
- 【前端笔记】BootStarp的table属性跨行跨列后无法居中
解决问题 引用BootStarp的table属性跨行跨列后无法居中. html代码如下(table为bootstarp属性): <head><link rel="style ...
最新文章
- 如何在ubuntu下安装detectron2_Anaconda中安装Cascade RCNN(Detectron)的若干问题
- 网工必看,万字网络排错笔记
- Vue3、TypeScript 实现图片数量及大小随宽度自适应调整
- [转]Flex与.NET互操作(三):基于WebService的数据访问(下)
- Spring框架学习笔记03:初探Spring——利用注解配置类取代Spring配置文件
- Oracle 用户,角色,权限的sql语句
- Java 重写 多态性_Java 学习(12):重写(Override)与重载(Overload) 多态
- 将图片从AutoCAD导出到Word
- 学习笔记——矩阵键盘的扫描原理与基本应用
- 没完全读懂的《人间失格》
- 汉语语法与人工智能--NLP哈工大
- TDK是什么意思,TDK怎么写?怎么利于SEO优化?
- 浏览器中的js不能同步更新的解决方案
- php 自定义排序,thinkphp6.0自定义排序order by field
- 用计算机做图画ppt模板,装逼|如何用一张图片做出一份高颜值的PPT模板
- 【网络爬虫】初探网络爬虫
- HEVC(h265)学习
- python查看字符串的编码格式_Python 3 查看字符编码方法
- Ubuntu查看usb设备驱动/usb以太网卡设备驱动
- 一道对10年间中国行政区划个数进行对比的Python考试题
热门文章
- 前端学习(3019):vue+element今日头条管理--自定义格式化面板
- [html] 如何实现默认显示git的第一帧图片,当鼠标经过时,播放完整的gif动画
- [html]html实现页面跳转都有哪些方法?
- [css] 请使用css画一个圆,方法可以多种
- 工作312:uni-时间戳处理
- [vue-cli]vue-cli3你有使用过吗?它和2.x版本有什么区别?
- [js] localStorage什么时候过期?
- [js] js操作节点的方法有哪些?
- 工作45:注意公用方法 别混入
- 前端学习(2255)代码是如何冲突得