xlsx.core.min.js获取excel数据

• 需求：

首先点击“模板下载”下载excel模板（房号模板.xlsx直接存放在工程下），存放需要导入的数据==（导入一列数据，如有需求，可自己拓展）==，然后点击批量导入按钮选择excel目标文件，将数据获取封装到json中。

• 相关操作：

js文件(通过CDN方式引入)

<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
<script src="https://cdn.bootcss.com/xlsx/0.11.5/xlsx.core.min.js"></script>

jsp代码，modal(弹框部分代码，不含css)

<div class="panelCont" style="height: 162px;display: flex;flex-direction: column;justify-content: center;">
     <div class="panelBtn" style="margin-top: 0px!important;">
         <form id="addMultiFm">
             <input type="file" name="file" class="am-form-field" style="display: none;"
                    accept="application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" required>
         </form>
         <div id="batchImportHouse" class="op-btn temp" style="margin-right: 50px!important;">批量导入</div>
         <div id="manualAddHouse" class="op-btn temp" style="margin-right: 0px!important;">手动添加</div>
     </div>
     <a href="/IntellComSys/pub/file/房号模板.xlsx" class="module-download">
         模板下载
     </a>
 </div>

modal截图

excel模板截图

js代码，实现获取excel数据，并封装

$("#batchImportHouse").click( function () {
    var keyFinal = "房屋门号";//头
    $("input[name='file']").click().change(function(e){ //file的值改变时，请求
        var files = e.target.files;
        var fileReader = new FileReader();
        fileReader.onload = function(ev) {
            try {
                var data = ev.target.result
                var workbook = XLSX.read(data, {
                    type: 'binary'
                }); // 以二进制流方式读取得到整份excel表格对象
                var rooms = []; // 存储获取到的数据
            } catch (e) {
                alertMsg(2, '文件类型不正确, 请重新选择文件');
                return;
            }
            
            // 表格的表格范围，可用于判断表头是否数量是否正确
            var fromTo = '';
            // 遍历没一张sheet并读取内容
            for (var sheet in workbook.Sheets) {
                if (workbook.Sheets.hasOwnProperty(sheet)) {
                    fromTo = workbook.Sheets[sheet]['!ref'];
                    if(!fromTo){
                        alertMsg(2, '文件内容为空, 导入失败');
                        return;
                    }
                    rooms = rooms.concat(XLSX.utils.sheet_to_json(workbook.Sheets[sheet]));
                    // break; // 如果只取第一张表，就取消注释这行
                }
            }
            
            var roomName = [];//门号数组
            var flag = 1;
            for(var room in rooms){
                if(getJsonObjLength(rooms[room]) > 1){//excel存在多列
                    alertMsg(2, '内容包含多列，导入失败');
                    flag = 0;
                }
                else if(!rooms[room].hasOwnProperty(keyFinal)){
                    alertMsg(2, '表头有误，导入失败');
                    flag = 0;
                }else{
                    roomName[room] = rooms[room][keyFinal];
                    var nary = roomName.sort();//对卡号进行排序
                    for(var i=0;i<roomName.length;i++){
                        if (nary[i]==nary[i+1]){
                            alertMsg(2,"重复门号："+nary[i]+ ", 导入失败");
                            flag = 0;
                            break;
                        }
                    }
                }
            }
            
            if(flag == 1){
                var param = {};
                param.staffId = staffId;
                param.buildingUnitId = localStorage.getItem("buildingUnitId");
                param.roomName = roomName;
                //addHouseMethod(param);//调用接口，实现导入，此方法没提供
            }
        };
        // 以二进制方式打开文件
        fileReader.readAsBinaryString(files[0]);
    });
});

js工具方法

//返回json的长度
function getJsonObjLength(jsonObj) {
    var Length = 0;
    for (var item in jsonObj) {
        Length++;
    }
    return Length;
}