关于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;
}
//在这里执行对解析后数据的处理
};
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;
}
}
关于jquery js读取excel文件内容 xls xlsx格式 纯前端的更多相关文章
- 使用POI读取excel文件内容
1.前言 项目中要求读取excel文件内容,并将其转化为xml格式.常见读取excel文档一般使用POI和JExcelAPI这两个工具.这里我们介绍使用POI实现读取excel文档. 2.代码实例: ...
- PHP读取Excel文件内容
PHP读取Excel文件内容 项目需要读取Excel的内容,从百度搜索了下,主要有两个选择,第一个是PHPExcelReader,另外一个是PHPExcel. PHPExcelReader比较 ...
- 手工创建tomcat应用,以及实现js读取本地文件内容
手工创建tomcat应用: 1.在webapps下面新建应用目录文件夹 2.在文件夹下创建或是从其他应用中复制:META-INF,WEB-INF这两个文件夹, 其中META-INF清空里面,WEB-I ...
- java实现读取excel文件内容
package excel; import java.io.FileInputStream; import java.io.InputStream; import java.text.SimpleDa ...
- R读取excel文件乱码 read.xlsx() 解决方法
1. 参考[R语言]R读取含中文excel文件,read.xlsx乱码问题 该文章总结得很好,可以直接跳到最后看博主的总结. 2. 如果依旧是乱码那么用read.xlsx2()去读取excel文件, ...
- Java 读取Excel 文件内容
在一个项目中,有一个需求,是把excel文件的内容转换为xml格式展示.在学习如何操作的过程中,首先是如何获取excel文件,其中操作的代码如下: 1.首先是导入需要的 jar, 下载地址:https ...
- 分别用Java和JS读取Properties文件内容
项目中经常用到的配置文件,除了XML文件之外,还会用到Properties文件来存储一些信息,例如国际化的设置.jdbc连接信息的配置等.有时候也会把一些路径或者sql语句放到Properties中, ...
- java读取excel文件内容
1.导入依赖JAR包 <!-- jxl 操作excel --> <dependency> <groupId>org.jxls</groupId> < ...
- c# 读取 excel文件内容,写入txt文档
1 winform 读取excel文档 1)点击button按钮,弹出上传excel窗口 private void button_headcompany_Click(object sender, Ev ...
随机推荐
- Unity添加小米游戏SDK
因为游戏要上线小米的平台,所以游戏就要添加小米SDK,整了3天总算是把小米SDK添加上了~~ 多亏找到了这个帖子:Unity3D接入小米盒子SDK. (小米人家论坛有官方贴出来的其他开发者的接入经验~ ...
- 题解 nflsoj489 【六校联合训练 CSP #15】小D与随机
题目链接 考虑枚举好点的集合.此时要考虑的问题是如何填入\(1\sim n\)这些数使得恰好我们枚举到的这些点是好点,即:求出有多少种合法的填数方案. \(1\)号点一定是好点.那么除\(1\)号点外 ...
- 5G大潮下卖点越来越少的苹果,会成为下一个诺基亚吗?
当下,5G显然成为手机厂商继全面屏.AI等之后,又一个重要的风口.为了赶上这个风口,很多厂商不惜寻找各种噱头去吸引大众的关注.比如小米在发布MIX 3之前疯狂造势称要发布5G版,但在10月25日的发布 ...
- VUE - vuex state的使用
1,安装 进入项目目录,执行 vue add vuex 命令 2,会在src的目录下新增store文件夹 3,打开store文件夹下的index.js , 给 state 设定一些数据 impor ...
- java执行操作系统脚本
http://www.cnblogs.com/bencakes/p/6139477.html 以前只是知道Runtime.getRuntime().exec(command);这种用法,但是有时候命令 ...
- CLion的使用
配置远程Linux编译器 实现目标:1.将项目中的源码和target和Linux服务器同步.2.代码在服务器端运行 配置ToolChains setting -> Build,Execution ...
- hook框架frida添加至于安卓应用中
转载至于https://koz.io/using-frida-on-android-without-root/ Frida is a great toolkit by @oleavr, used to ...
- 010.CI4框架CodeIgniter, autoload自动加载自己的helper函数类
01.自己定义了一个helper类,里面有个函数用来输出 02.定义一个Controller基本类,我们以后用到的Controllers类都继承自这个类.其中自动加载helper函数如图所示: 03. ...
- 初识python 廖雪峰(慕课网)
3-9 Python中的布尔类型 短路计算 True和False是布尔值,就像1,2,3是整数,“abc”是字符串一样. 做这个题,需要了解以下两点: 第一,在一个语句中,当and和or同时存在时,a ...
- 八数码问题 IDA*搜索
#include<iostream> #include<string> #include<cmath> #include<cstring> #inclu ...