jsp 页面数据导出成 excel 的方法很多，今天介绍一种简单的 js 方法：
源码如下：
// 导出$scope.doExportExcel = function() {var winname = window.open('', '_blank', 'top=10000'); //获得页面上需要导出的数据内容 var strHTML = document.all.content_med_statement.innerHTML; // 其中tableExcel是需要导出数据的div的id或者表的id
winname.document.open('text/html', 'replace');
winname.document.writeln(strHTML);
winname.document.execCommand('saveas','','lmapp.xls'); // excel是导出excel的默认名称
winname.close();
复制代码
代码解读
window.open('', '_blank', 'top=10000');
用javascript中的window.open()在一个新窗口打开一个新的空白网页。
window.open(pageURL,name,parameters)
其中：
2. document.all.content_med_statement.innerHTML;
document.all是页面内所有元素的一个集合。如：
document.all(0)表示页面内第一个元素。
document.all可以判断浏览器是否是 IE：
if(document.all){
alert("IE!");
}
复制代码
winname.document.open('text/html', 'replace');
open() 方法可打开一个新文档，并擦除当前文档的内容。
document.open(mimetype,replace)
参数描述
说明
提示和注释
重要事项：调用 open() 方法打开一个新文档并且用 write() 方法设置文档内容后，必须记住用 close 方法关闭文档，并迫使其内容显示出来。
注释：属于被覆盖的文档的一部分的脚本或事件句柄不能调用该方法，因为脚本或事件句柄自身也会被覆盖。
winname.document.execCommand('saveas','','lmapp.xls');
document.execCommand(sCommand,交互方式, 动态参数])
复制代码
交互方式参数如果是 true 的话将显示对话框，如果为 false 的话，则不显示对话框，动态参数一般为一可用值或属性值。
如果把“.”后面的内容放进去的话就改变文件的格式属性了，从而也就得到了我们所需要的.xls excel 格式。
阅读完源码之后,在实际操作过程中还是出现了问题，之间弹出框一闪而过，然后就没有任何效果了。
继续尝试其它方法，发现一个问题:是不是因为自己没有安装微软的 excel，因为我知道自己安装的是 wps。尝试安装一下微软的 excel。
结果发现问题依旧，尝试以下代码:
<HTML><HEAD><TITLE>将页面中指定表格的数据导入到Excel中</TITLE><SCRIPT LANGUAGE="javascript"><!--function AutoExcel(){var oXL = new ActiveXObject("Excel.Application"); //创建应该对象var oWB = oXL.Workbooks.Add();//新建一个Excel工作簿var oSheet = oWB.ActiveSheet;//指定要写入内容的工作表为活动工作表var table = document.getElementById("data");//指定要写入的数据源的idvar hang = table.rows.length;//取数据源行数var lie = table.rows(0).cells.length;//取数据源列数
// Add table headers going cell by cell.for (i=0;i<hang;i++){//在Excel中写行for (j=0;j<lie;j++){//在Excel中写列//定义格式oSheet.Cells(i+1,j+1).NumberFormatLocal = "@";//将单元格的格式定义为文本//oSheet.Cells(i+1,j+1).Font.Bold = true;//加粗oSheet.Cells(i+1,j+1).Font.Size = 10;//字体大小oSheet.Cells(i+1,j+1).value = table.rows(i).cells(j).innerText;//向单元格写入值}}oXL.Visible = true;oXL.UserControl = true;oXL=null}//--></SCRIPT></HEAD>
<BODY>
<table border="0" width="300" id="data" bgcolor="black" cellspacing="1"><tr bgcolor="white"><td>编号</td><td>姓名</td><td>年龄</td><td>性别</td></tr><tr bgcolor="white"><td>0001</td><td>张三</td><td>22</td><td>女</td></tr><tr bgcolor="white"><td>0002</td><td>李四</td><td>23</td><td>男</td></tr></table><input type="button" name="out_excel" onclick="AutoExcel();" value="导出到excel"></BODY></HTML>
复制代码
结果发现，其只可以运行在 IE 浏览器下，估计对 IE 的版本还会有限制，无语了。结果就是个这吗？难道只有 IE 才可以吗？更无语的是,下面的数据表格居然无法导出。
<table class="table" id="body_med_statement" border="1" cellpadding="0" cellspacing="0" style="border-collapse:collapse"><tbody><tr><th>序号</th><th>药品名</th>
<th>药品ID</th><th>价格</th><th>数量</th><th>下单时间</th><th>订单ID</th><th>订单内容</th><th>购药者</th>
<th>处方药</th><th>药品种类</th><td ng-bind="$index+1" class="ng-binding">1</td> <td class="ng-binding">感冒灵颗粒</td> <td><a ui-sref="#" class="ng-binding">TZ11020480</a></td> <td class="ng-binding">8</td> <td class="ng-binding">1</td> <td class="ng-binding">2015-11-19 11:06:05</td> <td class="ng-binding">LM2015081700001736</td> <td class="ng-binding">[感冒灵颗粒]</td> <td class="ng-binding">U13899990000</td> <td class="ng-binding">处方</td> <td class="ng-binding">中药</td> </tr><!-- end ngRepeat: item in querydata --><tr ng-repeat="item in querydata" class="ng-scope">
<td ng-bind="$index+1" class="ng-binding">2</td> <td class="ng-binding">感冒灵颗粒</td> <td><a ui-sref="#" class="ng-binding">TZ11020480</a></td> <td class="ng-binding">8</td> <td class="ng-binding">1</td> <td class="ng-binding">2015-11-19 11:19:38</td> <td class="ng-binding">LM2015081700001980</td> <td class="ng-binding">[感冒灵颗粒]</td> <td class="ng-binding">U13899990000</td> <td class="ng-binding">处方</td> <td class="ng-binding">中药</td> </tr><!-- end ngRepeat: item in querydata --></tbody></table>
复制代码
继续尝试其它方法:
function method1(tableid){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;//激活当前sheetvar sel = document.body.createTextRange();sel.moveToElementText(curTbl); //把表格中的内容移到TextRange中sel.select(); //全选TextRange中内容sel.execCommand("Copy");//复制TextRange中内容oSheet.Paste();//粘贴到活动的EXCEL中oXL.Visible = true; //设置excel可见属性var fname = oXL.Application.GetSaveAsFilename("将table导出到excel.xls", "Excel Spreadsheets (*.xls), *.xls");oWB.SaveAs(fname);oWB.Close();oXL.Quit();}
复制代码
经过对比，发现这个方法最实用。决定对之进行改进。改进的第一步首先还是阅读源码。
var fname = oXL.Application.GetSaveAsFilename("lmapp_.xls", "Excel Spreadsheets (*.xls), *.xls");
复制代码
Application.GetSaveAsFilename 方法：简单来说就是显示另存为对话框，方便用户输入文件名进行保存。
语法：
expression.GetSaveAsFilename(InitialFilename, FileFilter, FilterIndex, Title, ButtonText)
使用的时候请注意如下几项：
如果省略 InitialFilename 参数，Microsoft Excel 将活动工作簿的名称作为初始文件名
如果省略 FileFilter 参数，则默认参数值为“所有文件 (.),.”
如果省略 FilterIndex 参数，或者取值大于可用筛选数目，则采用第一个文件筛选条件
如果省略 Title 参数，则使用默认标题。
接着又发现一个怪现象:开发的管理系统可以在 Chrome、FireFox 等浏览器上运行，但是在 IE 上却没有任何效果。
火狐是最严格执行 w3c 标准的。你在网页中用到了哪些特殊的 html, css, js 特性，可以先到 w3c 网站看看这些特性得到了哪些浏览器的支持。
new ActiveXObject("Excel.Application"); //创建AX对象excel
复制代码
在 FireFox 中创建对象时报错。解决方法：IE 安全级别降低
ActiveX 控制可以调本机的任何资源,可以实现所有可执行文件的功能,但是这个插件,在第一次从网页上载入时,需要从网上下载(自动),并且需要由用户许可后才行.要显示该程序是安全说明,需要向微软申请.
更致命的是:ActiveX 仅限 IE 浏览器中使用。无解决方案！
但是问题又来了，系统在 IE 上跑不起来啊！
备注：AngularJS 1.3 抛弃了对 IE8 的支持。可以在我的博客上了解更多内容。AngularJS 1.2 将继续支持 IE8，但核心团队已经不打算在解决 IE8 及之前版本的问题上花时间。
而自己恰好使用的就是 1.3 系列版本,浏览器就是 IE8！无语了都，被兼容性搞的头晕目眩。
尝试着使用更高版本的 IE 浏览器，例如 IE9、IE10。
有一句话意味深长，粘贴，姑且体会之。
总而言之，使用了 angular.js，就仿佛看到了当初 W3C 标准化组织对 web 的远景规划：用 XML 替代 html 一样。各种操作声明、自定义标签将使 DOM 操作和应用逻辑解耦，它能大大改善代码的可调性。Angular 信奉的是，当组建视图(UI)同时又要写软件逻辑时，声明式的代码会比命令式的代码好得多。
随着mvvm逐渐成熟，现在使用jQuery构建 web 应用已经显得过时了，而且使用jQuery需要编写更多的代码去控制 dom 的取值、赋值、绑定事件等，而mvvm从底层实现了对以上操作的支持，让程序员可以从原始的复杂、重复的编码中解放出来，让程序员可以将更多的重心放在业务的实现、数据的交互上去，而且大大减少了程序员需要编写的代码量。
多年来的 web 经验告诉我们，编写 web 应用最难的地方主要在于浏览器的兼容问题，而且更多的兼容问题主要体现在 ie 上，因此只要能解决 ie 上的问题，那么这个 web 应用的其他问题都不再是问题了。
评论