js读取excel文件

在做项目的时候，需要上传一些excel文件内容到服务器。但是，用户没有点击提交的时候，或者刷新到其他页面的时候，需要放弃本次操作。本来是想着用redis来做缓存，暂时存储。但由于用户未点击提交的情况比较负责，不太适合此场景。SO，推荐一个比较成熟的解决方案：js-xlsx。

话不多说，直接上代码：
1. 定义一个文件上传项：

<input type="file" id="excel-file">

下载js-xlsx的相应xlsx.core.min.js 文件后引入

$('#excel-file').change(function(e) {var files = e.target.files;var fileReader = new FileReader();fileReader.onload = function(ev) {try {var data = ev.target.result,workbook = XLSX.read(data, {type: 'binary'}), // 以二进制流方式读取得到整份excel表格对象persons = []; // 存储获取到的数据} catch (e) {console.log('文件类型不正确');return;}// 表格的表格范围，可用于判断表头是否数量是否正确var fromTo = '';// 遍历每张表读取for (var sheet in workbook.Sheets) {if (workbook.Sheets.hasOwnProperty(sheet)) {fromTo = workbook.Sheets[sheet]['!ref'];console.log(fromTo);persons = persons.concat(XLSX.utils.sheet_to_json(workbook.Sheets[sheet]));// break; // 如果只取第一张表，就取消注释这行}}console.log(persons);};// 以二进制方式打开文件fileReader.readAsBinaryString(files[0]);});

PS：这个是正常使用jquery解决的。But，我的就比较坑了，项目用的是angularjs 2，导致我有调试了半天，很坑，记录一下：
1. 定义一个文件上传项：

<input ng-model="agentIds" type="file" style="margin-left: 480px;" id="excel-file" onchange="angular.element(this).scope().readExcel(this.files)" >

下载js-xlsx的相应xlsx.core.min.js 文件后引入

// 读取excel内容$scope.readExcel = function(e) {var files = e;console.log(e);var fileReader = new FileReader();fileReader.onload = function(ev) {try {var data = ev.target.result,workbook = XLSX.read(data, {type: 'binary'}), // 以二进制流方式读取得到整份excel表格对象persons = []; // 存储获取到的数据} catch (e) {console.log('文件类型不正确');return;}// 表格的表格范围，可用于判断表头是否数量是否正确var fromTo = '';// 遍历每张表读取for (var sheet in workbook.Sheets) {if (workbook.Sheets.hasOwnProperty(sheet)) {fromTo = workbook.Sheets[sheet]['!ref'];console.log(fromTo);persons = persons.concat(XLSX.utils.sheet_to_json(workbook.Sheets[sheet]));// break; // 如果只取第一张表，就取消注释这行}}// 定义自己需要的返回值var res = "";for(var i = 0; i < persons.length; i++) {res += persons[i].agentId + ",";}if(res.endWith(",")) {res = res.substr(0, res.length-1);}$scope.agentIds = res;console.log("------>"+ $scope.agentIds);};String.prototype.endWith=function(endStr){var d=this.length-endStr.length;return (d>=0&&this.lastIndexOf(endStr)==d)}// 以二进制方式打开文件fileReader.readAsBinaryString(files[0]);}

官方地址：https://github.com/SheetJS/js-xlsx

最后，推荐一篇博客，对我帮助很大：前端读取Excel报表文件

js读取excel文件相关推荐

java解析excel的js页面,js读取excel文件并显示
js读取excel文件并展示本帖最后由 a911dalin 于 2013-12-30 13:01:17 编辑如题,读取excel中所有数据和格式,求大神帮忙,明天就得赶出来分享到: 更多 --- ...
js node.js读取excel文件返回为json文本
node-xlsx: 基于Node.js解析excel文件数据及生成excel文件:只支持xlsx xlsx: 基于Node.js解析excel文件数据及生成excel文件:只支持xlsx excel ...
xlsx.core.min.js读取excel文件数据（无乱码，测试通过）
下载xlsx.core.min.js html: <input type="file" "onChange(event)" title="选择e ...
js 读取excel文件中的时间格式转换问题
将 44901.3576388889 excel读取的时间戳转换为 2022-12-06 08:28 /*** @param {number} time 传入的时间* @param {blob} f ...
XLSX.js读取excel文件忽略第一行
XLSX.utils.sheet_to_json(workbook.Sheets['XXX'], { range: 1 })
js 读取excel 导入mysql_可以读取EXCEL文件的js代码
首页给个有中文说明的例子,下面的例子很多大家可以多测试. function readExcel() { var excelApp; var excelWorkBook; var excelSheet; ...
form表单提交，Servlet接收并读取Excel文件
首先是jsp页面: <body scroll=no style="overflow-y:hidden;" onselectstart="return false&q ...
PhpSpreadsheet如何读取excel文件
PhpSpreadsheet如何读取excel文件一.总结一句话总结:万能的百度,直接搜代码就好,绝对有,毕竟github上面4000+的关注,说明很多人用了这个,使用照着demo倒是异常简单二 ...
java代码里的JSON格式怎么写好看_python3 循环读取excel文件并写入json操作
文件内容: excel内容: 代码: import xlrdimport jsonimport operatordef read_xlsx(filename): # 打开excel文件 data1 = ...
javaScript读取excel文件中某几行的数据
一.介绍这份代码借鉴了YouTube上的这个视频:https://www.youtube.com/watch?v=OK60UdWyUdE代码,讲解得很棒,让我一个不太懂javasript的小白明白了 ...

js读取excel文件

js读取excel文件相关推荐

最新文章

热门文章