JS導出JSON到Excel表格

本文轉載自查看原文 2019-09-05 16:19 574 JavaScript

<a href="javascript:;" id="export">導出</a>

<script>

    $("#export").click(function () {
        var Title = [{ "value": "姓名" }, { "value": "課題組" }, { "value": "手機" }, { "value": "手機短號" }, { "value": "申請人郵箱" }, { "value": "申請培訓時間" }, { "value": "動物實驗資格證號" }, { "value": "狀態" }];
        var Value = [{ "Fullnames": "扯淡", "Fullname": "扯淡", "Mobile": "18888888888", "Mobilecornet": "021-88888888", "Email": "8888@qq.com", "TimeAllocation": "9月份第四周", "QualificationCode": "9876543210", "Status": "已審核" }, { "Fullnames": "扯淡", "Fullname": "扯淡1", "Mobile": "18999999999", "Mobilecornet": "021-99999999", "Email": "9999@qq.com", "TimeAllocation": "3月份第四周", "QualificationCode": "0123456789", "Status": "未審核" }];
        var data = { "title": Title, "data": Value };
        JSONToExcelConvertor("培訓申請管理", data.data, data.title);
    })

    function JSONToExcelConvertor(FileName, JSONData, 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 style=\"color:red\">" + 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] === "." ? "" : arrData[i][index];
                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>

原文：https://blog.csdn.net/educast/article/details/52775559

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 js導出Excel表格 Vue導出json數據到Excel表格 Vue導出json數據到Excel表格 angular6 將表格的JSON數據導出為excel js導出excel表格並生成多sheet JS導出頁面table到Excel表格 js實現數據導出為excel表格 VUE中使用vue-json-excel 將后台返回的json以excel表格形式導出前端導出excel表格 vue 導出excel表格