本地html导入excel表格,前端JS实现一键导入excel表格

前面的文章中已经讲过关于js表格的导出，此文章主要说到的是excel文件如何导入到网页中，并在网页端显示。

代码部分:

js导入excel

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) {

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 exceljson = xlsx.utils.sheet_to_json(wb.sheets[wb.sheetnames[0]]);

document.getelementbyid("excelcontent").innerhtml= json.stringify( exceljson );

};

if(rabs) {

reader.readasarraybuffer(f);

} else {

reader.readasbinarystring(f);

}

}

//文件流转binarystring

function fixdata(data) {

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;

}

导入前的表格：

导入后的显示：