JS解析Excel

通常，我们都是将Excel文件上传打服务器后再进行解析数据保存入库，然而当没有必要保存Excel文件时，但又要保证用户体验时，我们就可以用JS脚本来接地本地Excel将数据直接传到后台进行操作。

因为也是第一次用JS去解析Excel，百度出来的解决方案都是需要引用js-xlsx.js。然而项目必须使用IE8，结果可想而知，该死的IE8！

下面就都介绍一下吧。

1.IE8以及一下，用JS解析本地文件。

先说一下大体流程，用户通过File文本框选择文件，点击右边保存，数据显示在前台，数据提交后台。

html

<td align="center">
    <input class="easyui-filebox" id="file1" data-options="buttonText:‘浏览‘" style="width:350px">
    <a href="javascript:addExcel()" class="easyui-linkbutton" data-options="iconCls:‘icon-ok‘">保存</a>
</td>

function addExcel(){//显示excel
     var str = $("#file1").filebox("getValue");//获取本地路径
     var s=str.split("\.");
    if(str==‘‘){
        alert("请选择excel的路径信息！");
        return;
    }
    if(s[1]=="xls" || s[1]=="xlsx"){//判断文件格式
        try {
            var oXL = new ActiveXObject("Excel.Application");//创建Excel.Application对象
            var oWB = oXL.Workbooks.open(str);//打开并读取文件
            var oSheet = oWB.ActiveSheet;//将sheet页作为对象
            processExcel(oSheet);//读取数据
        } catch(e) {
            if (e.number == -2146827859) {
                alert("请检查你的电脑是否装有Excel并且已经启用Activex控件!");
            } else {
                alert("你上传的Excel文件格式不正确！");
                alert(e.description);
            }
        }
         finally {
            oXL.quit();
        }
    } else {
        alert("只能加载Excel文件！");
    }
}
function processExcel(oSheet){
  if( //规定模板格式
      new String(oSheet.cells(1,1))!=‘项目代码‘||
        new String(oSheet.cells(1,2))!=‘项目‘||
        new String(oSheet.cells(1,3))!=‘本旬收入‘||
        new String(oSheet.cells(1,4))!=‘本旬进度‘||
        new String(oSheet.cells(1,5))!=‘本月预计‘||
        new String(oSheet.cells(2,2))!=‘      各项收入合计‘||
      new String(oSheet.cells(3,2))!=‘一、税收收入合计‘||
      new String(oSheet.cells(4,2))!=‘其中：中央级‘||
      new String(oSheet.cells(5,2))!=‘      省级‘||
      new String(oSheet.cells(6,2))!=‘      市县级‘||
      new String(oSheet.cells(7,2))!=‘    1、国内增值税‘||
      new String(oSheet.cells(8,2))!=‘    2、国内消费税‘||
      new String(oSheet.cells(9,2))!=‘    3、营业税‘||
      new String(oSheet.cells(10,2))!=‘    4、企业所得税‘||
      new String(oSheet.cells(11,2))!=‘    5、个人所得税‘||
      new String(oSheet.cells(12,2))!=‘    6、资源税‘||
      new String(oSheet.cells(13,2))!=‘    7、固定资产投资方向调节税‘||
      new String(oSheet.cells(14,2))!=‘    8、城市维护建设税‘||
      new String(oSheet.cells(15,2))!=‘    9、房产税‘ ||
      new String(oSheet.cells(16,2))!=‘    10、印花税‘ ||
      new String(oSheet.cells(17,2))!=‘    11、城市土地使用税‘ ||
      new String(oSheet.cells(18,2))!=‘    12、土地增值税‘ ||
      new String(oSheet.cells(19,2))!=‘    13、车船税‘ ||
      new String(oSheet.cells(20,2))!=‘    14、车辆购置税‘ ||
      new String(oSheet.cells(21,2))!=‘    15、烟叶税‘ ||
      new String(oSheet.cells(22,2))!=‘    16、耕地占用税‘ ||
      new String(oSheet.cells(23,2))!=‘    17、契税‘ ||
      new String(oSheet.cells(24,2))!=‘二、其他收入合计‘ ||
      new String(oSheet.cells(25,2))!=‘    1、教育费附加收入‘ ||
      new String(oSheet.cells(26,2))!=‘    2、文化事业建设费‘ ||
      new String(oSheet.cells(27,2))!=‘    3、社会保险基金收入‘ ||
      new String(oSheet.cells(28,2))!=‘    4、地方教育附加‘ ||
      new String(oSheet.cells(29,2))!=‘    5、残疾人就业保障金‘ ||
      new String(oSheet.cells(30,2))!=‘    6、其他收入‘||
        new String(oSheet.cells(2,1))!=‘1‘||
      new String(oSheet.cells(3,1))!=‘100‘||
      new String(oSheet.cells(4,1))!=‘1000‘||
      new String(oSheet.cells(5,1))!=‘2000‘||
      new String(oSheet.cells(6,1))!=‘3000‘||
      new String(oSheet.cells(7,1))!=‘10101‘||
      new String(oSheet.cells(8,1))!=‘10102‘||
      new String(oSheet.cells(9,1))!=‘10103‘||
      new String(oSheet.cells(10,1))!=‘10104‘||
      new String(oSheet.cells(11,1))!=‘10106‘||
      new String(oSheet.cells(12,1))!=‘10107‘||
      new String(oSheet.cells(13,1))!=‘10108‘||
      new String(oSheet.cells(14,1))!=‘10109‘||
      new String(oSheet.cells(15,1))!=‘10110‘ ||
      new String(oSheet.cells(16,1))!=‘10111‘ ||
      new String(oSheet.cells(17,1))!=‘10112‘ ||
      new String(oSheet.cells(18,1))!=‘10113‘ ||
      new String(oSheet.cells(19,1))!=‘10114‘ ||
      new String(oSheet.cells(20,1))!=‘10116‘ ||
      new String(oSheet.cells(21,1))!=‘10120‘ ||
      new String(oSheet.cells(22,1))!=‘10118‘ ||
      new String(oSheet.cells(23,1))!=‘10119‘ ||
      new String(oSheet.cells(24,1))!=‘200‘ ||
      new String(oSheet.cells(25,1))!=‘30203‘ ||
      new String(oSheet.cells(26,1))!=‘30217‘ ||
      new String(oSheet.cells(27,1))!=‘10200‘ ||
      new String(oSheet.cells(28,1))!=‘30216‘ ||
      new String(oSheet.cells(29,1))!=‘30218‘ ||
      new String(oSheet.cells(30,1))!=‘30221‘
    ){
      alert("模板不正确，请使用正确模板导入数据！");
      return;
    }else{
        var i=0;
        var i2=1;
        var tb="";
        while(i<30){//模板为三十行
            i++;
            tb+="<tr >"+
            "<td>"+(new String(oSheet.cells(i,2))=="undefined"?"0":new String(oSheet.cells(i,2)))+"</td>"+
            "<td>"+(new String(oSheet.cells(i,3))=="undefined"?"0":new String(oSheet.cells(i,3)))+"</td>"+
            "<td>"+(new String(oSheet.cells(i,4))=="undefined"?"0":new String(oSheet.cells(i,4)))+"</td>"+
            "<td>"+(new String(oSheet.cells(i,5))=="undefined"?"0":new String(oSheet.cells(i,5)))+"</td>"+
            "<td>"+(new String(oSheet.cells(i,6))=="undefined"?"0":new String(oSheet.cells(i,6)))+"</td></tr>";
        }
        $("#tb_excel").empty();
        $("#tb_excel").append(tb);
        var a="";
        var trs=$("#tb_excel").find("tr");
        while(i2<30){
            i2++;
            var c3=(new String(oSheet.cells(i2,3))=="undefined"?"0":new String(oSheet.cells(i2,3)));
            var c4=(new String(oSheet.cells(i2,4))=="undefined"?"0":new String(oSheet.cells(i2,4)));
            var c5=(new String(oSheet.cells(i2,5))=="undefined"?"0":new String(oSheet.cells(i2,5)));
            var c6=(new String(oSheet.cells(i2,6))=="undefined"?"0":new String(oSheet.cells(i2,6)));
            if(isNaN(c3.replace(/\\/g,"/"))){
                $(trs[i2-1]).find("td").eq(1).css("color","red");
                a="阻止";
            }
            if(isNaN(c4.replace(/\\/g,"/"))){
                $(trs[i2-1]).find("td").eq(2).css("color","red");
                a="阻止";
            }
            if(isNaN(c5.replace(/\\/g,"/"))){
                $(trs[i2-1]).find("td").eq(3).css("color","red");
                a="阻止";
            }
            if(isNaN(c6.replace(/\\/g,"/"))){
                $(trs[i2-1]).find("td").eq(4).css("color","red");
                a="阻止";
            }
        }
        if(a=="阻止"){
            alert("标红出必须为数字！");
            return;
        }
        insertExcel(oSheet);
    }
}
function insertExcel(oSheet){//保存excel数据
    var xun=$("#xun").val();
    var arr=[];
    var i=1;
    while(i<30){
        i++;
        var o={
            "xx_id":xun,
            "unt_lev2_id":"${QX_SWJG_DM}",
            "zsxm_lev3_id":new String(oSheet.cells(i,1))=="undefined"?"":new String(oSheet.cells(i,1)),
            "zsxm_name":new String(oSheet.cells(i,2))=="undefined"?"":new String(oSheet.cells(i,2)),
            "xx_rev":new String(oSheet.cells(i,3))=="undefined"?"0":new String(oSheet.cells(i,3)),
            "xx_jd":new String(oSheet.cells(i,4))=="undefined"?"0":new String(oSheet.cells(i,4)),
            "fcst_mm_rev":new String(oSheet.cells(i,5))=="undefined"?"0":new String(oSheet.cells(i,5)),
            "fcst_yy_rev":new String(oSheet.cells(i,6))=="undefined"?"0":new String(oSheet.cells(i,6))
        };
        arr.push(o);
    }
    var j=JSON.stringify(arr);
    $.post("bb_zzsrgl_zlsb!insertExcel.action",{"jsonArr":j},function(result){
        if(result.cont>0){
            alert("保存成功！");
        }else{
            alert("保存失败！");
        }
    },"json");
}

2.非IE，我们就可以用xlsx.js来解析，超简单

html

<input type="file" onchange="importf(this)"/>
<div id="demo"></div>

/*
FileReader共有4种读取方法：
1.readAsArrayBuffer(file)：将文件读取为ArrayBuffer。
2.readAsBinaryString(file)：将文件读取为二进制字符串
3.readAsDataURL(file)：将文件读取为Data URL
4.readAsText(file, [encoding])：将文件读取为文本，encoding缺省值为‘UTF-8‘
             */
var wb;//读取完成的数据
var rABS = false; //是否将文件读取为二进制字符串
function importf(obj){
    if(!obj.files) {
        return;
    }
    var f = obj.files[0];
    var reader = new FileReader();
    reader.onload = function(e) {
        var data = e.target.result;
        if(rABS) {
            alert("手动");
            wb = XLSX.read(btoa(fixdata(data)), {//手动转化
                type: ‘base64‘
            });
            alert(wb+"**00000000000000");
        } else {
            wb = XLSX.read(data, {
                type: ‘binary‘
            });
            alert(wb+"**1111111111111111");
        }
        //wb.SheetNames[0]是获取Sheets中第一个Sheet的名字
        //wb.Sheets[Sheet名]获取第一个Sheet的数据
        var j=JSON.stringify( XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]) );
        document.getElementById("demo").innerHTML= JSON.stringify( XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]) );
        var ej=eval("("+j+")");
        alert(ej.length);
    };
    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;
}

时间： 2024-10-08 20:04:28

JS解析Excel的相关文章

Node.js解析Excel

1.使用node-xlsx包 var xlsx = require('node-xlsx'); 只支持xlsx格式 2.解析的Excel文件格式如下: 3.程序如下: var obj = xlsx.parse('D:/test.xlsx'); //第一个工作表的数据 var data = obj.worksheets[0].data; //列数 var maxCol = obj.worksheets[0].maxCol; //行数 var maxRow = obj.worksheets[0].m

使用node.js生成excel报表下载(excel-export express篇)

引言:日常工作中已经有许多应用功能块使用了nodejs作为web服务器,而生成报表下载也是我们在传统应用. java中提供了2套类库实现(jxl 和POI),.NET 作为微软的亲儿子更加不用说,各种com组件贴心使用. nodejs作为一门新的语言,报表功能也不是十分完善. (1).js-xlsx : 目前 Github 上 star 数量最多的处理 Excel 的库,支持解析多种格式表格XLSX / XLSM / XLSB / XLS / CSV,解析采用纯js实现,写入需要依赖nodejs

AngularJS之前端解析excel文件

之前发现一款比较强大的js解析excel插件SheetJS js-xlsx,一直未投入到生产中使用.最近有批量导入的需求,大致看了下文档,使用比较方便快捷,容易上手,现在以AngularJS为例,介绍下其基本使用: 1.下载核心js文件xlsx.full.min.js,通过script标签引入到项目中 github地址:https://github.com/sheetjs/js-xlsx 2.编写自定义指令 1 xxx.directive('importSheet', function () {

框架 day50 BOS项目 4 批量导入(ocupload插件,pinyin4J)/POI解析Excel/Combobox下拉框/分区组合条件分页查询(ajax)/分区数据导出(Excel)

知识点: 批量导入(ocupload插件,pinyin4J /POI解析Excel(apache POI) /区域分页查询 /Combobox下拉框 /分区组合条件分页查询(ajax) /分区数据导出(Excel下载) BOS项目笔记第4天 1. 区域批量导入功能 *Ajax不支持文件上传. *上传并且不刷新上传页面原理: Target到一个0,0,0的隐藏iframe里,造成一个没有刷新的假象 <form target="myIframe" action="ab

导入解析excel小结

导入解析excel小结控制器例子: 一. 解析excel内容插入到数据库 Vm: <form id=’form_file’ method=’post’ enctype=’multipart/form-data’> <input id="uploadFile" type="file" name='uploadFile' /> <a href=’javascirpt(void0)’ onclick=’resolv();’>解

JS-XLS/X读取和解析Excel表格文件(xls/xlsx)的JavaScript插件

最近有一个要求,我的一个项目中解析Excel文件(与xls/xlsx扩展)在浏览器(使用JavaScript当然).所以我在网上看了一下,发现了这2个有用的库: js-xls js-xlsx 让我们看看他们是如何工作的. 兼容性支持读取文件格式 Excel 2007+ XML Formats (XLSX/XLSM) Excel 2007+ Binary Format (XLSB) Excel 2003-2004 XML Format (XML "SpreadsheetML") Exc

Java学习之道：Java上传下载excel、解析Excel、生成Excel的问题

在软件开发过程中难免需要批量上传与下载,生成报表保存也是常有之事,最近集团门户开发用到了Excel模版下载,Excel生成,圆满完成,对这一知识点进行整理,资源共享,有不足之处还望批评指正,文章结尾提供了所需jar包的下载,方便大伙使用,下面言归正传! 1.Excel的下载 1)Action中: 添加响应事件,通过getRealPath获得工程路径,与jsp中获得request.getContextPath()效果相同,fileName为要下载的文件名,经过拼接filePath是xls文件的绝对

Java上传下载excel、解析Excel、生成Excel

结合项目（Spring+(基于注解的)SpringMVC和Mybatis+uploadify文件上传）--poi解析Excel文件

poi解析Excel文件 1.上传文件至服务器 2.解析Excel文件并返回数据集合 3.将数据保存到服务器框架======Spring+(基于注解的)SpringMVC和Mybatis===== 第一步: 前台: jsp文件采用的是uploadify <div id="fileQueue"></div> <input type="file" id="brandFile"> js: <script ty