js-xlsx操作excel表格
1导入与导出功能实现
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title> </head>
<body>
<input type="button" value="导入" onclick="file_in()"><br><br>
<input type="button" value="导出" onclick="file_out()">
<!--导入文件使用控件-->
<input type="file" id="excel_in" style="display:none;" />
<!-- 导出文件使用控件,标签不需要内容 -->
<a href="javascript" id="excel_out" download="这里是下载的文件名.xlsx" style="display:none;"></a> <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script src="http://oss.sheetjs.com/js-xlsx/xlsx.full.min.js"></script>
<script type="text/javascript" src="xlsxhelper.js"></script>
<script type="text/javascript">
//导入excel
function file_in() {
$('#excel_in').click();
} $('#excel_in').change(function (e) {
xlsx.importf(this, getexceldata);
}) function getexceldata(info) {
console.log(info);
} var jsono = [{ //测试数据
"保质期临期预警(天)": "adventLifecycle",
"商品标题": "title",
"建议零售价": "defaultPrice"
}, { //测试数据
"保质期临期预警(天)": "adventLifecycle2",
"商品标题": "title2",
"建议零售价": "defaultPrice2"
}];
//导出excel
function file_out() {
$('#excel_out').attr('download', 'download.xls');
xlsx.downloadExl(jsono, $('#excel_out')[0]);
}; </script>
</body>
</html>
html页
;(function () {
window.xlsx = window.xlsx || {
/*para*/
/*end para*/
/*function*/
//excel内容读取(只读取第一个sheet)
/* FileReader共有4种读取方法:
* 1.readAsArrayBuffer(file):将文件读取为ArrayBuffer。
* 2.readAsBinaryString(file):将文件读取为二进制字符串
* 3.readAsDataURL(file):将文件读取为Data URL
* 4.readAsText(file, [encoding]):将文件读取为文本,encoding缺省值为'UTF-8' */
importf: function (obj, callback) {//导入
if (!obj.files) {
callback('');
return;
}
var f = obj.files[0];
var reg = /^.*\.(?:xls|xlsx)$/i;//文件名可以带空格
if (!reg.test(f.name)) {//校验不通过
alert("请上传excel格式的文件!");
callback('');
return;
}
var wb;//读取完成的数据
var rABS = false; //是否将文件读取为二进制字符串
var reader = new FileReader();
reader.onload = function (e) {
var data = e.target.result;
if (rABS) {
wb = XLSX.read(btoa(xlsx.fixdata(data)), {//手动转化
type: 'base64'
});
} else {
wb = XLSX.read(data, {type: 'binary'});
}
//wb.SheetNames[0]是获取Sheets中第一个Sheet的名字
//wb.Sheets[Sheet名]获取第一个Sheet的数据
//document.getElementById("demo").innerHTML = JSON.stringify(XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]));
var dom = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
callback(dom);
return;
};
if (rABS) {
reader.readAsArrayBuffer(f);
}
else {
reader.readAsBinaryString(f);
}
},
fixdata: function (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;
},
downloadExl: function (json, targetdom, type) {
var tmpDown; //导出的二进制对象
var tmpdata = json[0];
json.unshift({});
var keyMap = []; //获取keys
//keyMap =Object.keys(json[0]);
for (var k in tmpdata) {
keyMap.push(k);
json[0][k] = k;
}
var tmpdata = [];//用来保存转换好的json
json.map((v, i) => keyMap.map((k, j) => Object.assign({}, {
v: v[k],
position: (j > 25 ? xlsx.getCharCol(j) : String.fromCharCode(65 + j)) + (i + 1)
}))).reduce((prev, next) => prev.concat(next)).forEach((v, i) => tmpdata[v.position] = {
v: v.v
});
var outputPos = Object.keys(tmpdata); //设置区域,比如表格从A1到D10
var tmpWB = {
SheetNames: ['mySheet'], //保存的表标题
Sheets: {
'mySheet': Object.assign({},
tmpdata, //内容
{
'!ref': outputPos[0] + ':' + outputPos[outputPos.length - 1] //设置填充区域
})
}
};
tmpDown = new Blob([xlsx.s2ab(XLSX.write(tmpWB,
{bookType: (type == undefined ? 'xlsx' : type), bookSST: false, type: 'binary'}//这里的数据是用来定义导出的格式类型
))], {
type: ""
}); //创建二进制对象写入转换好的字节流
var href = URL.createObjectURL(tmpDown); //创建对象超链接
//document.getElementById("hf").href = href; //绑定a标签
//document.getElementById("hf").click(); //模拟点击实现下载
targetdom.href = href;
targetdom.click();
setTimeout(function () { //延时释放
URL.revokeObjectURL(tmpDown); //用URL.revokeObjectURL()来释放这个object URL
}, 100);
},
s2ab: function (s) { //字符串转字符流
var buf = new ArrayBuffer(s.length);
var view = new Uint8Array(buf);
for (var i = 0; i != s.length; ++i) {
view[i] = s.charCodeAt(i) & 0xFF;
}
return buf;
},
// 将指定的自然数转换为26进制表示。映射关系:[0-25] -> [A-Z]。
getCharCol: function (n) {
var temCol = '';
var s = '';
var m = 0;
while (n > 0) {
m = n % 26 + 1;
s = String.fromCharCode(m + 64) + s;
n = (n - m) / 26;
}
return s;
},
//生成新的GUID
getHtml: function () {
//alert($('.breadcrumbs').html());
}
/*end function*/
}
})();
xlsxhelper.js
js-xlsx操作excel表格的更多相关文章
- Python 利用Python操作excel表格之openyxl介绍Part2
利用Python操作excel表格之openyxl介绍 by:授客 QQ:1033553122 欢迎加入全国软件测试交流qq群(群号:7156436) ## 绘图 c = LineChart() ...
- Python 利用Python操作excel表格之openyxl介绍Part1
利用Python操作excel表格之openyxl介绍 by:授客 QQ:1033553122 欢迎加入全国软件测试交流qq群(群号:7156436),免费获取以下性能监控工具(类似Nmon精简版) ...
- 【转】python操作excel表格(xlrd/xlwt)
[转]python操作excel表格(xlrd/xlwt) 最近遇到一个情景,就是定期生成并发送服务器使用情况报表,按照不同维度统计,涉及python对excel的操作,上网搜罗了一番,大多大同小异, ...
- 用NPOI、C#操作Excel表格生成班级成绩单
在C#中利用NPOI操作Excel表格非常方便,几乎上支持所有的Excel表格本身所有的功能,如字体设置.颜色设置.单元格合并.数值计算.页眉页脚等等. 这里准备使用NPOI生成一个班级成绩单Exce ...
- 转载:python操作excel表格(xlrd/xlwt)
python操作excel表格(xlrd/xlwt) 最近遇到一个情景,就是定期生成并发送服务器使用情况报表,按照不同维度统计,涉及python对excel的操作,上网搜罗了一番,大多大同小异,而 ...
- 使用Java操作Excel表格
目录 一.配置第三方库 二.使用Apache POI API 1. 打开Excel文件 2. 选择对应的sheet 3. Sheet接口的基本使用 3.1 获取开头行和结束行 3.2 获取Row对象 ...
- qt 操作excel表格
自己编写的一个Qt C++类,用于操作excel表格,在Qt中操作excel需在.pro中增加CONFIG+=qaxcontainer配置. 1.打开Excel:objExcel = new QAx ...
- Python 利用Python操作excel表格之xlwt介绍
利用Python操作excel表格之xlwt介绍 by:授客 QQ:1033553122 直接上代码 案例1 #!/usr/bin/env python # -*- coding:utf-8 ...
- python - 操作excel表格
说明:由于公司oa暂缺,人事妹子在做考勤的时候,需要通过几个excel表格去交叉比对员工是否有旷工或迟到,工作量大而且容易出错. 这时候it屌丝的机会来啦,花了一天时间给妹子撸了一个自动化脚本. 1. ...
- 【面试题】js实现将excel表格copy到页面
js实现将excel表格copy到页面 点击打开视频讲解更加详细 其实最核心的技术,还是copy的是我们粘贴板上的数据 就像平常怎么粘贴复制其他的数据一样,只是我们在excel粘贴的是一个表格数据 这 ...
随机推荐
- CMD命令提示符
mspaint 画图板 notepad 打开记事本 write 写字板 calc.exe 计算器 control.exe 控制面板 osk 打开屏幕键盘 rononce -p ----15 ...
- POJ2135:Farm Tour——题解
http://poj.org/problem?id=2135 题目大意: 从1到n再回来,每条边只能走一次,问最短路. —————————————————— 如果不告诉我是费用流打死不会想这个…… 我 ...
- bzoj3232圈地游戏——0/1分数规划+差分建模+判环
Description DZY家的后院有一块地,由N行M列的方格组成,格子内种的菜有一定的价值,并且每一条单位长度的格线有一定的费用. DZY喜欢在地里散步.他总是从任意一个格点出发,沿着格线行走直到 ...
- RabbitMQ 作用
1.RabbitMQ 作用 同步变异步 解耦 削峰 2.
- 使用freemarker生成word、html时图片显示问题
使用freemarker生成word.html时图片显示问题 博客分类: Java 使用freemarker生成word时图片显示问题使用freemarker生成html时图片显示问题使用iText生 ...
- maven中用yuicompressor和closure-compiler对js、css文件进行压缩
转载自:http://matychen.iteye.com/blog/1477350 项目采用maven构建的时候,需要压缩js,css等,网上找了相关资料,自己综合了下- 直接放代码: <! ...
- shell 将字符串作为变量名并打印
使用shell的eval实现此功能.代码如下: #!/bin/sh IP9="127.0.0.1" i=9 eval echo \$IP${i} #!/bin/sh WEBIP0= ...
- [洛谷P2597] [ZJOI2012]灾难
洛谷题目链接:[ZJOI2012]灾难 题目描述 阿米巴是小强的好朋友. 阿米巴和小强在草原上捉蚂蚱.小强突然想,如果蚂蚱被他们捉灭绝了,那么吃蚂蚱的小鸟就会饿死,而捕食小鸟的猛禽也会跟着灭绝,从而引 ...
- Freemarker的配置与使用
1.在pro.xml配置文件中引入架包 <!--freemarker--> <dependency> <groupId>freemarker</grou ...
- C# 如何用多字符分割字符串
用单字符分割字符串大家应该很熟悉,例如: string source = "dfd^Afdf^AAAAAA^Adfdf"; var list= source.Split('A'); ...