1. 程式人生 > >js資料匯出excel

js資料匯出excel

<html>
<meta charset="utf-8">
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8">
    <script type="text/javascript" src="js/jquery-2.2.0.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $('#Export').click(function(){
                var data = {
                    "title":[
                        {"value":"集團", "type":"ROW_HEADER_HEADER", "datatype":"string"},
                        {"value":"創始人", "type":"ROW_HEADER_HEADER", "datatype":"string"}
                    ],
                    "data":[
                        [
                         {"value":"阿里巴巴", "type":"ROW_HEADER"},
                         {"value":"馬雲", "type":"ROW_HEADER"}
                         ]
                    ]
                };
                if(data == '')
                    return;
                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="Export" value="匯出" />
</body>
</html>