• 关于jquery js读取excel文件内容 xls xlsx格式 纯前端


     附带参考:http://blog.csdn.net/gongzhongnian/article/details/76438555

     更详细导入导出:https://www.jianshu.com/p/74d405940305

            https://www.jianshu.com/p/044c183edf42

    ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

    在一个项目中需要读取excel的内容,当然excel是有格式的,格式就是读取到的第一行会作为属性(Title)

    例如如下excel

    Language Detil
    en English
    cn Chinese
    jp Japanese

     

     

     

     

     

    该excel会解析成:方式1

    当然也可以解析成:方式2

    ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

    正文开始:

    首先需要引用xlsx.full.min.js 提供链接:https://pan.baidu.com/s/1o7HK6vw

    首先页面添加input type=file 来获取文件

    <input  type="file" onchange="importExcel(this)" class="filter_input form-control"/>

    onchange里面的函数如下:

    var wb;//读取完成的数据
    var rABS = false; //是否将文件读取为二进制字符串
    
    function importExcel(obj) {//导入if(obj.files.length==0) {return;
         }
        const IMPORTFILE_MAXSIZE = 10*1024;//这里可以自定义控制导入文件大小
        var suffix = obj.files[0].name.split(".")[1]
        $('#_file_path').val(obj.files[0].name);
        if(suffix != 'xls' && suffix !='xlsx'){
            layer.msg("Only support excel!");
            return;
        }
        if(obj.files[0].size/1024 > IMPORTFILE_MAXSIZE){
            layer.msg("The file can not over 10MB");
            return;
        }
        var f = obj.files[0];
        var reader = new FileReader();
        reader.onload = function(e) {
            data = e.target.result;
            if(rABS) {
                wb = XLSX.read(btoa(fixdata(data)), {//手动转化
                    type: 'base64'
                });
            } else {
                wb = XLSX.read(data, {
                    type: 'binary'
                });
            }
            //wb.SheetNames[0]是获取Sheets中第一个Sheet的名字
            //wb.Sheets[Sheet名]获取第一个Sheet的数据
            var a=wb.SheetNames[0];
            var b=wb.Sheets[a];//内容为方式2
            data=XLSX.utils.sheet_to_json(b);//内容为方式1
            if(!data||data==""){     
                layer.closeAll('loading');
                layer.msg("The file is empty please choose another file!");
                return;
            }
         //在这里执行对解析后数据的处理
          //var Compile_Result=Batch_Compile(data);

          //DrawTable(Compile_Result);
    
        };
        if(rABS) {
            reader.readAsArrayBuffer(f);
        } else {
            reader.readAsBinaryString(f);
        }
        function fixdata(data) { //文件流转BinaryString
            var o = "",
                l = 0,
                w = 10240;
            for(; l < data.byteLength / w; ++l) o += String.fromCharCode.apply(null, new Uint8Array(data.slice(l * w, l * w + w)));
            o += String.fromCharCode.apply(null, new Uint8Array(data.slice(l * w)));
            return o;
        }
    }

     

    MrNou
  • 相关阅读:
    typeof检测几种较为特殊的值与Boolean强制转换哪几种值为false Amy
    类型检测 Amy
    JS基本概念 Amy
    JS导入文件与CSS导入文件的不同 Amy
    JS运行环境 Amy
    主流浏览器及其渲染引擎 Amy
    JS引用类型 Amy
    同名函数的覆盖问题 Amy
    JS变量、作用域和内存问题 Amy
    HTTP协议学习(1)
  • 原文地址:https://www.cnblogs.com/yangsirc/p/8135013.html
Copyright © 2020-2023  润新知