纯前台js json导出到excel,不与后台交互

上代码

[javascript] view plain copy
  1. <html>  
  2. <head>  
  3.     <meta http-equiv="content-type" content="text/html; charset=utf-8">  
  4.     <script type="text/javascript" src="jquery.min.js"></script>  
  5.     <script type="text/javascript">  
  6.         $(document).ready(function(){  
  7.             $('#wwo').click(function(){  
  8.                 var data = {"title":[{"value":"集团""type":"ROW_HEADER_HEADER""datatype":"string"}, {"value":"日期""type":"ROW_HEADER_HEADER""datatype":"string"}],"data":[[{"value":"好好""type":"ROW_HEADER"}, {"value":"2015-08-24""type":"ROW_HEADER"}]]};  
  9.                 if(data == '')  
  10.                     return;  
  11.                 JSONToExcelConvertor(data.data, "Report", data.title);  
  12.             });  
  13.         });  
  14.   
  15.         function JSONToExcelConvertor(JSONData, FileName, ShowLabel) {  
  16.             //先转化json  
  17.             var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData;  
  18.               
  19.             var excel = '<table>';      
  20.               
  21.             //设置表头  
  22.             var row = "<tr>";  
  23.             for (var i = 0, l = ShowLabel.length; i < l; i++) {  
  24.                 row += "<td>" + ShowLabel[i].value + '</td>';  
  25.             }  
  26.               
  27.               
  28.             //换行  
  29.             excel += row + "</tr>";  
  30.               
  31.             //设置数据  
  32.             for (var i = 0; i < arrData.length; i++) {  
  33.                 var row = "<tr>";  
  34.                   
  35.                 for (var index in arrData[i]) {  
  36.                     var value = arrData[i][index].value === "." ? "" : arrData[i][index].value;  
  37.                     row += '<td>' + value + '</td>';  
  38.                 }  
  39.                   
  40.                 excel += row + "</tr>";  
  41.             }  
  42.   
  43.             excel += "</table>";  
  44.   
  45.             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'>";  
  46.             excelFile += '<meta http-equiv="content-type" content="application/vnd.ms-excel; charset=UTF-8">';  
  47.             excelFile += '<meta http-equiv="content-type" content="application/vnd.ms-excel';  
  48.             excelFile += '; charset=UTF-8">';  
  49.             excelFile += "<head>";  
  50.             excelFile += "<!--[if gte mso 9]>";  
  51.             excelFile += "<xml>";  
  52.             excelFile += "<x:ExcelWorkbook>";  
  53.             excelFile += "<x:ExcelWorksheets>";  
  54.             excelFile += "<x:ExcelWorksheet>";  
  55.             excelFile += "<x:Name>";  
  56.             excelFile += "{worksheet}";  
  57.             excelFile += "</x:Name>";  
  58.             excelFile += "<x:WorksheetOptions>";  
  59.             excelFile += "<x:DisplayGridlines/>";  
  60.             excelFile += "</x:WorksheetOptions>";  
  61.             excelFile += "</x:ExcelWorksheet>";  
  62.             excelFile += "</x:ExcelWorksheets>";  
  63.             excelFile += "</x:ExcelWorkbook>";  
  64.             excelFile += "</xml>";  
  65.             excelFile += "<![endif]-->";  
  66.             excelFile += "</head>";  
  67.             excelFile += "<body>";  
  68.             excelFile += excel;  
  69.             excelFile += "</body>";  
  70.             excelFile += "</html>";  
  71.   
  72.               
  73.             var uri = 'data:application/vnd.ms-excel;charset=utf-8,' + encodeURIComponent(excelFile);  
  74.               
  75.             var link = document.createElement("a");      
  76.             link.href = uri;  
  77.               
  78.             link.style = "visibility:hidden";  
  79.             link.download = FileName + ".xls";  
  80.               
  81.             document.body.appendChild(link);  
  82.             link.click();  
  83.             document.body.removeChild(link);  
  84.         }  
  85.     </script>  
  86. </head>  
  87. <body>  
  88.     <input type="button" id="wwo" value="导出" />  
  89. </body>  
  90. </html>  

附件是tableExport代码

http://download.csdn.net/detail/a410147597/9052583
原文地址:https://www.cnblogs.com/hzcya1995/p/13317843.html