之前在做项目的时候需要将数据库中的数据导出为excel表格方便打印查阅,在网上找了很多插件也没有找到自己理想的好用的插件(也就是说没有找到令我满意的插件),最近在学习a标签的相关知识时了解到,a标签不仅仅只有在href给一个URL跳转到指定页面,如果href指定的是一个文件路径,那么点击a标签触发的便会是下载该文件,看到这里边突发奇想,能否利用a标签的这个特点,来完成excel数据导出呢!经过自己的代码编写测试发现完全可以,并且a标签点击事件能通过代码触发,这就更加有利于我这个插件的编写,下面将编写的过程及代码更新如下:
a标签触发事件,只需要运用原生的javaScript代码获取到a标签的DOM节点,触发其点击事件,代码如下:
document.getElementById("a").click();
注意哦:其中双引号中的a代表的是id为a的HTML中a标签对应的DOM节点。
前端界面只需放置一个按钮
<button type="button" class="btn btn-primary" onclick="daochu()">导出数据</button>
下面将编写js代码处理button的onclick事件
function daochu(){
$.ajax({
。。。//ajax请求,这里将不再仔细写明
success:function(json){
$("#ff").append("<a id='a' href='+json.url+' style="display:none"></a>");//url是后台传过来的路径,即将数据库经过处理成excel表格存储的文件路径
}
});
document.getElementById("a").click();//触发a的点击事件下载excel表格数据
}
后台处理数据库数据为excel文件的代码我这里将不再贴出,网上代码很多,在这里我感谢 ink4t 提供的Java处理数据库数据为excel数据,有需要的同学请自行打开连接学习,http://blog.csdn.net/ink4t/article/details/77150183。
到这里,excel数据导出的插件已介绍完毕,请自行参考学习。