javascript将json格式数组下载为excel表格的方法


Posted in Javascript onDecember 22, 2017

实例如下:

<html> 
<head> 
  <meta http-equiv="content-type" content="text/html; charset=utf-8"> 
  <script type="text/javascript" src="jquery183.min.js"></script> 
  <script type="text/javascript"> 
    $(document).ready(function(){ 
      $('#wwo').click(function(){ 
        var data = {
"title":
[
{"value":"A1标题"}, 
{"value":"B1标题"}
],
"data":
[
[
{"value":"好好"}, 
{"value":"2015-08-24"}
],
[
{"value":"123"}, 
{"value":"hahah"}
]
]
}; 
        if(data == ''){ 
          return; 
}else{
JSONToExcelConvertor(data.data, "Report", data.title); 
}
      }); 
    }); 
 
    function JSONToExcelConvertor(JSONData, FileName, ShowLabel) { 
      //先转化json 
      var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData; 
       
      var excel = '<table>';   
       
      //设置表头 
      var row = "<tr>"; 
      for (var i = 0, l = ShowLabel.length; i < l; i++) { 
        row += "<td>" + ShowLabel[i].value + '</td>'; 
      } 
       
       
      //换行 
      excel += row + "</tr>"; 
       
      //设置数据 
      for (var i = 0; i < arrData.length; i++) { 
        var row = "<tr>"; 
         
        for (var index in arrData[i]) { 
          var value = arrData[i][index].value === "." ? "" : arrData[i][index].value; 
          row += '<td>' + value + '</td>'; 
        } 
         
        excel += row + "</tr>"; 
      } 
 
      excel += "</table>"; 
 
      var excelFile = "<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'>"; 
      excelFile += '<meta http-equiv="content-type" content="application/vnd.ms-excel; charset=UTF-8">'; 
      excelFile += '<meta http-equiv="content-type" content="application/vnd.ms-excel'; 
      excelFile += '; charset=UTF-8">'; 
      excelFile += "<head>"; 
      excelFile += "<!--[if gte mso 9]>"; 
      excelFile += "<xml>"; 
      excelFile += "<x:ExcelWorkbook>"; 
      excelFile += "<x:ExcelWorksheets>"; 
      excelFile += "<x:ExcelWorksheet>"; 
      excelFile += "<x:Name>"; 
      excelFile += "{worksheet}"; 
      excelFile += "</x:Name>"; 
      excelFile += "<x:WorksheetOptions>"; 
      excelFile += "<x:DisplayGridlines/>"; 
      excelFile += "</x:WorksheetOptions>"; 
      excelFile += "</x:ExcelWorksheet>"; 
      excelFile += "</x:ExcelWorksheets>"; 
      excelFile += "</x:ExcelWorkbook>"; 
      excelFile += "</xml>"; 
      excelFile += "<![endif]-->"; 
      excelFile += "</head>"; 
      excelFile += "<body>"; 
      excelFile += excel; 
      excelFile += "</body>"; 
      excelFile += "</html>"; 
 
       
      var uri = 'data:application/vnd.ms-excel;charset=utf-8,' + encodeURIComponent(excelFile); 
       
      var link = document.createElement("a");   
      link.href = uri; 
       
      link.style = "visibility:hidden"; 
      link.download = FileName + ".xls"; 
       
      document.body.appendChild(link); 
      link.click(); 
      document.body.removeChild(link); 
    } 
  </script> 
</head> 
<body> 
  <input type="button" id="wwo" value="导出" /> 
</body> 
</html>

以上这篇javascript将json格式数组下载为excel表格的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript XML数据显示为HTML一例
Dec 23 Javascript
javascript 弹出窗口中是否显示地址栏的实现代码
Apr 14 Javascript
JavaScript实现快速排序(自已编写)
Dec 19 Javascript
jquery+css+ul模拟列表菜单具体实现思路
Apr 15 Javascript
JS判断客服QQ号在线还是离线状态的方法
Jan 13 Javascript
使用angular写一个hello world
Jan 23 Javascript
使用jquery动态加载Js文件和Css文件
Oct 24 Javascript
使用CSS+JavaScript或纯js实现半透明遮罩效果的实例分享
May 09 Javascript
关于JavaScript的单双引号嵌套问题
Aug 20 Javascript
JQuery实现table中tr上移下移的示例(超简单)
Jan 08 jQuery
vue 修改 data 数据问题并实时显示的方法
Aug 27 Javascript
详解微信小程序工程化探索之webpack实战
Apr 20 Javascript
原生js实现移动端触摸轮播的示例代码
Dec 22 #Javascript
JavaScript多线程运行库Nexus.js详解
Dec 22 #Javascript
JS实现在文本指定位置插入内容的简单示例
Dec 22 #Javascript
JavaScript实现单例模式实例分享
Dec 22 #Javascript
vue使用axios时关于this的指向问题详解
Dec 22 #Javascript
Javascript中JSON数据分组优化实践及JS操作JSON总结
Dec 22 #Javascript
vue init失败简单解决方法(终极版)
Dec 22 #Javascript
You might like
解析php安全性问题中的:Null 字符问题
2013/06/21 PHP
使用PHP Socket 编程模拟Http post和get请求
2014/11/25 PHP
PHP中imagick函数的中文解释
2015/01/21 PHP
php求数组全排列,元素所有组合的方法
2016/05/05 PHP
PHP自定义函数格式化json数据示例
2016/09/14 PHP
PHP长连接实现与使用方法详解
2018/02/11 PHP
使用PHP反射机制来构造&quot;CREATE TABLE&quot;的sql语句
2019/03/21 PHP
Laravel 集成微信用户登录和绑定的实现
2019/12/27 PHP
JS 实现图片直接下载示例代码
2013/07/22 Javascript
Flex通过JS获取客户端IP和计算机名的实例代码
2013/11/21 Javascript
javascript模拟地球旋转效果代码实例
2013/12/02 Javascript
jquery使用jxl插件导出excel示例
2014/04/14 Javascript
jquery ui dialog替代confirm实例分析
2016/01/25 Javascript
在Node.js中使用Javascript Generators详解
2016/05/05 Javascript
JavaScript学习笔记整理_用于模式匹配的String方法
2016/09/19 Javascript
javascript输出AscII码扩展集中的字符方法
2016/12/26 Javascript
Bootstrap3下拉菜单的实现
2017/02/22 Javascript
NodeJs form-data格式传输文件的方法
2017/12/13 NodeJs
基于Vue开发数字输入框组件
2017/12/19 Javascript
JS中的BOM应用
2018/02/02 Javascript
vue做移动端适配最佳解决方案(亲测有效)
2018/09/04 Javascript
Django1.3添加app提示模块不存在的解决方法
2014/08/26 Python
Python的CGIHTTPServer交互实现详解
2018/02/08 Python
Python使用requests提交HTTP表单的方法
2018/12/26 Python
python卸载后再次安装遇到的问题解决
2019/07/10 Python
在django admin中配置搜索域是一个外键时的处理方法
2020/05/20 Python
python计算auc的方法
2020/09/09 Python
Python try except finally资源回收的实现
2021/01/25 Python
瑞贝卡·泰勒官方网站:Rebecca Taylor
2016/09/24 全球购物
全球最大的房车租赁市场:Outdoorsy
2018/09/19 全球购物
老公给老婆的道歉信
2014/01/10 职场文书
植树造林的宣传标语
2014/06/23 职场文书
公安派出所所长四风问题个人对照检查材料
2014/10/04 职场文书
涨价通知
2015/04/23 职场文书
三十年同学聚会致辞
2015/07/28 职场文书
预备党员表决心的话
2015/09/22 职场文书