利用js快速将页面中的table导出至Excel
在数据导入导出时,经常需要将数据导出至Excel编辑,下面介绍一种快速导出页面table标签数据到Excel的方法。
先看看效果。
下面展示源码:
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Line Charge Change Summary</title> <script src="../jquery/jquery-1.4.2.js" type="text/javascript"></script> <script src="../jquery/ui/jquery-ui.js" type="text/javascript"></script> <link href="../jquery/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" /> <style type="text/css"> .date_picker { width:90px;} table tr{ background-color:#FFFFFF} .claimlist_table{border-collapse: collapse;border:1px solid #cad9ea; text-align:center;} .claimlist_table_tr{background-color: #D0D0D0; height:15px;font-weight: bold;} </style> <script type="text/javascript"> $(function() { $(".date_picker").datepicker({ changeMonth: true, changeYear: true, dateFormat: "yy/mm/dd" }); }); function searchChange() { $("#form1").submit(); } function ExportExcel(tableid) //读取表格中每个单元到EXCEL中 { var curTbl = document.getElementById(tableid); //var oXL = new ActiveXObject("Excel.Application"); try { oXL = GetObject("", "Excel.Application"); } catch (E) { try { oXL = new ActiveXObject("Excel.Application"); } catch (E2) { alert("请确认:\n1.您使用的是IE浏览器.\n2.安装Microsoft Excel.\n3.设置浏览器安全级别:Internet 选项=>安全=>本地=>自定义级别: \n \"对未标记为可安全执行脚本的 ActiveX 控件初始化并执行脚本\" =>提示"); return; } } //创建AX对象excel var oWB = oXL.Workbooks.Add(); //获取workbook对象 var oSheet = oWB.ActiveSheet; //激活当前sheet var Lenr = curTbl.rows.length; //取得表格行数 for (i = 0; i < Lenr; i++) { var Lenc = curTbl.rows(i).cells.length; //取得每行的列数 for (j = 0; j < Lenc; j++) { oSheet.Cells(i + 1, j + 1).value = curTbl.rows(i).cells(j).innerText; //赋值 } }
//定义行高
oSheet.Rows(1 + ":" + 1).RowHeight = 30;
//定义列宽
oSheet.Columns(‘C:C‘).ColumnWidth = 12;
oSheet.Columns(‘D:D‘).ColumnWidth = 12;
oSheet.Columns(‘F:F‘).ColumnWidth = 12;
oSheet.Columns(‘M:M‘).ColumnWidth = 15;
oXL.Visible = true; //设置excel可见属性 oSheet.Application.Quit(); // 结束当前进程 window.opener = null; } </script> </head> <body> <form action="./line_charge_change_summary.asp" id="form1" name="form1" method="post" > <h3>Line Charge Change Summary</h3> <fieldset> <legend>Search for a period of time, the change of setup charge, monthly charge and working days.</legend><br /> <table> <tr><td>Modify Date:</td></tr> <tr><td>From <input type="text" class="date_picker" id="date_from" name="date_from" readonly="readonly" value="2014/01/10" /></td> <td> To <input type="text" class="date_picker" id="date_to" name="date_to" readonly="readonly" value="2014/01/14" /></td> <td style="width:100px"></td> <td><input type="button" value="Search" onclick="searchChange();" /></td> <td><input type="button" value="Export to Excel" style="text-align:right" onclick="ExportExcel(‘ld_city_summary‘)" /></td> </tr> </table><br /> <table id="ld_city_summary" class="" style="text-align:center;background-color:#2C6193; width:1200px;" border="0" cellspacing="1" cellpadding="0"> <tr class="claimlist_table_tr" style=" height:30px;"> <td>ID</td> <td>City</td> <td>Provider</td> <td>Inner/Outer</td> <td>LL Type</td> <td>Bandwidth</td> <td>NRC (Old)</td> <td>NRC (New)</td> <td>MRC (Old)</td> <td>MRC (New)</td> <td>Leadtime<br />(Old)</td> <td>Leadtime<br />(New)</td> <td>Last Update Time</td></tr> <tr> <td>1383</td> <td>湖南</td> <td>电信/网通</td> <td>区间</td> <td>FR/Eth</td> <td>2M</td> <td>2000</td> <td>2000</td> <td>1500</td> <td>1500</td> <td>40</td> <td>40</td> <td>2014-01-14 17:56:24</td> </tr> <tr> <td>1514</td> <td>湖南</td> <td>CU</td> <td>区内</td> <td>STM-1</td> <td>4M</td> <td>3000</td> <td>3000</td> <td>2666</td> <td>2666</td> <td>40</td> <td>40</td> <td>2014-01-14 17:56:24</td> </tr> <tr> <td>1515</td> <td>湖南</td> <td>CU</td> <td>区内</td> <td>STM-1</td> <td>6M</td> <td>3000</td> <td>3000</td> <td>3734</td> <td>3734</td> <td>40</td> <td>40</td> <td>2014-01-14 17:56:25</td> </tr> <tr> <td>1516</td> <td>湖南</td> <td>CU</td> <td>区内</td> <td>STM-1</td> <td>8M</td> <td>3000</td> <td>3000</td> <td>4800</td> <td>4800</td> <td>40</td> <td>40</td> <td>2014-01-14 17:56:26</td> </tr> <tr> <td>1517</td> <td>湖南</td> <td>CU</td> <td>区内</td> <td>STM-1</td> <td>10M</td> <td>3000</td> <td>3000</td> <td>5415</td> <td>5415</td> <td>40</td> <td>40</td> <td>2014-01-14 17:56:27</td> </tr> <tr> <td>1518</td> <td>湖南</td> <td>CU</td> <td>区内</td> <td>STM-1</td> <td>20M</td> <td>3000</td> <td>3000</td> <td>8492</td> <td>8492</td> <td>40</td> <td>40</td> <td>2014-01-14 17:56:28</td> </tr> <tr> <td>1519</td> <td>湖南</td> <td>CU</td> <td>区内</td> <td>STM-1</td> <td>30M</td> <td>3000</td> <td>3000</td> <td>11570</td> <td>11570</td> <td>40</td> <td>40</td> <td>2014-01-14 17:56:29</td> </tr> </table> <input type="hidden" id="hd_action" name="hd_action" value="search" /> </fieldset> </form> </body> </html>
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。