附带参考: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;
}
     //在这里执行对解析后数据的处理
      //var Compile_Result=Batch_Compile(data);
      //DrawTable(Compile_Result);
    };
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格式 纯前端的更多相关文章

  1. 使用POI读取excel文件内容

    1.前言 项目中要求读取excel文件内容,并将其转化为xml格式.常见读取excel文档一般使用POI和JExcelAPI这两个工具.这里我们介绍使用POI实现读取excel文档. 2.代码实例: ...

  2. PHP读取Excel文件内容

    PHP读取Excel文件内容   项目需要读取Excel的内容,从百度搜索了下,主要有两个选择,第一个是PHPExcelReader,另外一个是PHPExcel.   PHPExcelReader比较 ...

  3. 手工创建tomcat应用,以及实现js读取本地文件内容

    手工创建tomcat应用: 1.在webapps下面新建应用目录文件夹 2.在文件夹下创建或是从其他应用中复制:META-INF,WEB-INF这两个文件夹, 其中META-INF清空里面,WEB-I ...

  4. java实现读取excel文件内容

    package excel; import java.io.FileInputStream; import java.io.InputStream; import java.text.SimpleDa ...

  5. R读取excel文件乱码 read.xlsx() 解决方法

    1. 参考[R语言]R读取含中文excel文件,read.xlsx乱码问题  该文章总结得很好,可以直接跳到最后看博主的总结. 2. 如果依旧是乱码那么用read.xlsx2()去读取excel文件, ...

  6. Java 读取Excel 文件内容

    在一个项目中,有一个需求,是把excel文件的内容转换为xml格式展示.在学习如何操作的过程中,首先是如何获取excel文件,其中操作的代码如下: 1.首先是导入需要的 jar, 下载地址:https ...

  7. 分别用Java和JS读取Properties文件内容

    项目中经常用到的配置文件,除了XML文件之外,还会用到Properties文件来存储一些信息,例如国际化的设置.jdbc连接信息的配置等.有时候也会把一些路径或者sql语句放到Properties中, ...

  8. java读取excel文件内容

    1.导入依赖JAR包 <!-- jxl 操作excel --> <dependency> <groupId>org.jxls</groupId> < ...

  9. c# 读取 excel文件内容,写入txt文档

    1 winform 读取excel文档 1)点击button按钮,弹出上传excel窗口 private void button_headcompany_Click(object sender, Ev ...

随机推荐

  1. [STL]string类型的getline函数

    3.cin.getline() 实际是cin.getline(接收字符串到m,接收个数n,结束字符).接收一个字符串,可以接收空格等,最后一个字符为‘\0’.结束符可以通过设置第三个参数自己设置,默认 ...

  2. vim的几种模式&快捷键

    vim的几种模式&快捷键 2017年01月01日 14:05:24 阅读数:3060 一.vim的模式 基本上vim可以分为三种模式:命令模式,插入模式和底行模式,其实vim有多种模式,我们只 ...

  3. REVISITING FINE-TUNING FOR FEW-SHOT LEARNING

    https://arxiv.org/pdf/1910.00216.pdf   明天看

  4. RAID与磁盘管理之——综合应用

    为了实现磁盘的管理和RAID的综合,现将四块硬盘组合成一个RAID10,并在此基础之上创建物理卷.卷组.逻辑卷,实现在线扩容,最后挂载使用. 其中也部分包含了swap分区的创建和使用. 1.根据lin ...

  5. NIO 组件Buffer

    重要属性 属性 描述 Capacity 容量, 即可以容纳的最大数据量; 在缓冲区创建时被设定并且不能改变 Limit 表示缓冲区的当前终点, 不能对缓冲区超过极限的位置进行读写操作, 且极限是可以修 ...

  6. Job for nginx.service failed because the control process exited with error code. See “systemctl stat

    启动nginx服务时如果遇到这个错误 Job for nginx.service failed because the control process exited with error code. ...

  7. maven项目打包和运行

    1. 添加pom <build> <plugins> <plugin> <artifactId>maven-assembly-plugin</ar ...

  8. P1037 在霍格沃茨找零钱

    转跳点:

  9. UVA - 1513 Movie collection (树状数组)

    题意:有n个影碟,标号为1~n,位置为0~n-1,每次取出一个影碟看完后,将其放在最前面(标号为0处),问每个影碟取出前,其位置之前有多少个影碟. 分析: 1.数组大小开为100000*2,后1000 ...

  10. POJ 1472:Instant Complexity 模拟时间复杂度

    Instant Complexity Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 1908   Accepted: 658 ...