html自动读取excel文件内容吗,纯JS实现的读取excel文件内容功能示例【支持所有浏览器】...

本文实例讲述了纯js实现的读取excel文件内容功能。分享给大家供大家参考，具体如下：

template.html

js-xlsx live demo

#drop{

border:2px dashed #bbb;

-moz-border-radius:5px;

-webkit-border-radius:5px;

border-radius:5px;

padding:25px;

text-align:center;

font:20pt bold,"vollkorn";color:#bbb

}

#b64data{

width:100%;

}

a { text-decoration: none }

button{}

返回

提交

//这里主要封装了一下方法，可以忽略，主要使用到以下几个js

myexcel.js

/*jshint browser:true */

/*global xlsx */

var x = xlsx;

var xw = {

/* worker message */

msg: 'xlsx',

/* worker scripts */

rabs: '../js/xlsxworker2.js',

norabs: '../js/xlsxworker1.js',

noxfer: '../js/xlsxworker.js'

};

function ab2str(data) {

var o = "", l = 0, w = 10240;

for(; l

o+=string.fromcharcode.apply(null, new uint16array(data.slice(l*w)));

return o;

}

function s2ab(s) {

var b = new arraybuffer(s.length*2), v = new uint16array(b);

for (var i=0; i != s.length; ++i) v[i] = s.charcodeat(i);

return [v, b];

}

function xw_xfer(data, cb) {

var worker = new worker(rabs ? xw.rabs : xw.norabs);

worker.onmessage = function(e) {

switch(e.data.t) {

case 'ready': break;

case 'e': console.error(e.data.d); break;

default: xx=ab2str(e.data).replace(/\n/g,"\\n").replace(/\r/g,"\\r");cb(json.parse(xx)); break;

}

};

if(rabs) {

var val = s2ab(data);

worker.postmessage(val[1], [val[1]]);

} else {

worker.postmessage(data, [data]);

}

}

function xw(data, cb) {

transferable = document.getelementsbyname("xferable")[0].checked;

if(transferable) xw_xfer(data, cb);

else xw_noxfer(data, cb);

}

function get_radio_value( radioname ) {

var radios = document.getelementsbyname( radioname );

for( var i = 0; i < radios.length; i++ ) {

if( radios[i].checked || radios.length === 1 ) {

return radios[i].value;

}

}

}

function to_json(workbook) {

var result = {};

workbook.sheetnames.foreach(function(sheetname) {

var roa = x.utils.sheet_to_row_object_array(workbook.sheets[sheetname]);

if(roa.length > 0){

result[sheetname] = roa;

}

});

return result;

}

var tarea = document.getelementbyid('b64data');

function b64it() {

if(typeof console !== 'undefined') console.log("onload", new date());

var wb = x.read(tarea.value, {type: 'base64',wtf:wtf_mode});

process_wb(wb);

}

var token=cookies.get("token");

console.log(token);

if(token==null){

// alert("你是怎么进来的？请先登录");

// window.location.href="../login.html" rel="external nofollow" ;

}

var global_wb;

function process_wb(wb) {

global_wb = wb;

var output = "";

//这里是成绩批量录入代码，可以忽略不计

$(".submit_all").on("click",function(){

var array=object.values(to_json(wb))[0];

var len=array.length;

var array1="",array2="",array3="",array4="",array5="";

for(var i=0;i

array1+=array[i].学号+",";

array2+=array[i].成绩+",";

array3+=array[i].总分+",";

array4+=array[i].时间+",";

array5+=array[i].评语+",";

}

array1=array1.substring(0,array1.length-1);

array2=array2.substring(0,array2.length-1);

array3=array3.substring(0,array3.length-1);

array4=array4.substring(0,array4.length-1);

array5=array5.substring(0,array5.length-1);

console.log(array1);

var url='grade/addall';

var params={

"token":token,

"gradeuserid":array1,

"gradecourse":array2,

"graderank":array3,

"graderemark":array5,

"gradetime":array4

};

pulldata(url,params,function(res){

if(res.state==0){

alert("成绩录入成功！");

window.location.href="techrecord.html" rel="external nofollow" rel="external nofollow" ;

}

else if(res.state==1){

alert("您输入的学号不存在");

}

});

})

output = json.stringify(to_json(wb), 2, 2);

if(out.innertext === undefined) out.textcontent = output;

else out.innertext = output;

if(typeof console !== 'undefined') console.log(output);

}

function setfmt() {if(global_wb) process_wb(global_wb);}

var xlf = document.getelementbyid('xlf');

function handlefile(e) {

rabs = document.getelementsbyname("userabs")[0].checked;

use_worker = document.getelementsbyname("useworker")[0].checked;

var files = e.target.files;

var f = files[0];

{

var reader = new filereader();

var name = f.name;

reader.onload = function(e) {

if(typeof console !== 'undefined')

var data = e.target.result;

if(use_worker) {

xw(data, process_wb);

} else {

var wb;

if(rabs) {

wb = x.read(data, {type: 'binary'});

} else {

var arr = fixdata(data);

wb = x.read(btoa(arr), {type: 'base64'});

}

process_wb(wb);

}

};

if(rabs) reader.readasbinarystring(f);

else reader.readasarraybuffer(f);

}

}

if(xlf.addeventlistener) xlf.addeventlistener('change', handlefile, false);

导入一个新建的excel

查看读取到的值，以json格式显示

希望本文所述对大家javascript程序设计有所帮助。