js 上传excel解析成json，并保存为json文件（可下载）

朱雀 2022-12-02 10:43 195阅读 0赞

引用：

js：

<body>
    <input type="file" id="fileUploader" name="fileUploader" accept=".xls, .xlsx"/>
    <input type="button" id="export" value="保存"/>
    </br></br>
    <script>
        var content;
        var button = document.getElementById("export");
        button.addEventListener("click", saveHandler, false);
        function saveHandler() {
            var blob = new Blob([content], {type: "text/plain;charset=utf-8"});
            saveAs(blob, "save.json");
        }
        $(document).ready(function(){
            $("#fileUploader").change(function(evt){
                var selectedFile = evt.target.files[0];
                var reader = new FileReader();
                reader.onload = function(event) {
                    var data = event.target.result;
                    var workbook = XLSX.read(data, {
                        type: 'binary'
                    });
                    workbook.SheetNames.forEach(function(sheetName) {
                        var XL_row_object = XLSX.utils.sheet_to_row_object_array(workbook.Sheets[sheetName]);
                        if (XL_row_object.length > 0) {
                            content = JSON.stringify(XL_row_object);
                            console.log(content);
                            //document.getElementById("jsonObject").innerHTML = JSON.stringify(XL_row_object);
                        }
    
                    })
                };
                reader.onerror = function(event) {
                    console.error("File could not be read! Code " + event.target.error.code);
                };
                // 读取上传文件为二进制
                reader.readAsBinaryString(selectedFile);
            });
        });
    
    </script>
    </body>

![20200830094935530.png][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1RoZVdpc2VfbHp5_size_16_color_FFFFFF_t_70][]

[20200830094935530.png]: /images/20221123/7942ea92f8da4ff3b8e6209f0731d1be.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1RoZVdpc2VfbHp5_size_16_color_FFFFFF_t_70]: /images/20221123/b3c0583361b741fd839650f9b4c29948.png