html js csv导入excel文件,js通过CSV倒入excel数据

造轮子：

简单使用js将excel导入到页面。

首先将excel另存为csv格式(否则要使用zipjs，才能导入，并且只支持xlsx，不支持xls)

csv格式分析：

规则的如：

1,2,3

4,5,6

是不是感觉用英文逗号就可以分离每一cell了?

年轻人，说了每一个cell用英文逗号隔开，不代表每一个cell里都是纯洁的啊！

如果这几个：

每一个cell，用英文逗号隔开，如果中间出现双字节字符或空格或英文逗号，cell会加上双引号

1,,

4,5,6

1,"hello word",3,

4,5,6

1,",,,,,,",3,

4,5,6

分析到这里，就知道没有这么简单。不过还是有规律的。

1，可以用正则先匹配出",,,,,,"这种特殊情况

2，把双引号中间的英文逗号用自定义的一个分隔符替换：

",,,,,,"

""

3，处理完之后，再把替换回去，变成英文逗号。

4，当然这里也会有点小bug，就是excel中如果自带了自定义的分隔符呢？我没有好办法，手动改分隔符呗。你有好方法告诉我哦！

下面就是带有完整注释的方法体了

var input = document.querySelector('input');

input.addEventListener('change', function() {

//读取文件列表

importExcel(this.files, function(data) {

console.log(data);

});

}, false);

var importExcel = function(files, back) {

//判断参数类型，这里还可以判断一下文件类型

if (!files instanceof FileList) {

return [];

}

var loadIndex = 0;

var textFiles = [];

[].slice.call(files).forEach(function(file) {

var reader = new FileReader();

reader.onload = function(e) {

//e.target.result就是整个excel的内容了

textFiles.push(readCell(e.target.result));

loadIndex++;

if (loadIndex == files.length) {

//读取完所有文件后返回

back(textFiles);

}

};

//注意，这里用了指定编码来读取文件文本内容

reader.readAsText(file, 'gbk');

});

function readCell(ex) {

// 去除前后空格

return ex.trim()

// 获取数据行数

.split(/\n/gm).map(function(v) {

// 匹配出非单纯英文字符串的内容str

var str = v.match(/"[^"]+"/ig);

if (str) {

// 将匹配到的str中的英文逗号转换成标记符

var result = str.map(function(vv) {

return vv.replace(/,/g, '');

});

// 将原字符串v中的匹配到的str进行替换

str.forEach(function(vv, i) {

v = v.replace(vv, result[i]);

});

}

// 按逗号截取每一列数据，顺便去除前后空字符

v = v.split(/\s*,\s*/g)

.map(function(v) {

// 去除双引号

return v.replace(/"/g, '')

// 重新将标记符转换到英文逗号

.replace(//g, ',')

});

return v

});

}

}