JS导出、导入EXCEL(案例)
插件下载地址:http://oss.sheetjs.com/js-xlsx/xlsx.full.min.js
1、导出excel
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js导出excel</title>
</head>
<body>
<button onclick="downloadExl(jsono)">导出</button>
<a href="" download="我是导出来的测试文件.xlsx" id="downloadA"></a> <script src="xlsx.full.min.js"></script>
<script>
var jsono = [{
"姓名": "张三",
"年龄": "30",
"性别": "男"
},{
"姓名": "李四",
"年龄": "40",
"性别": "女"
},{
"姓名": "王五",
"年龄": "50",
"性别": "男"
}];
var tmpDown; //导出的二进制对象
function downloadExl(json, type) {
//根据json数据，获取excel的第一行(例如:姓名、年龄、性别)存至map
var tmpdata = json[0];
json.unshift({});
var keyMap = []; //获取keys
for (var k in tmpdata) {
keyMap.push(k);
json[0][k] = k;
} var tmpdata = [];
json.map((v, i) => keyMap.map((k, j) => Object.assign({}, {
v: v[k],
position: (j > 25 ? getCharCol(j) : String.fromCharCode(65 + j)) + (i + 1)
}))).reduce((prev, next) => prev.concat(next)).forEach((v, i) => tmpdata[v.position] = {
v: v.v
}); //设置区域,比如表格从A1到D10
var outputPos = Object.keys(tmpdata);
var tmpWB = {
SheetNames: ['mySheet'], //保存的表标题
Sheets: {
'mySheet': Object.assign({},
tmpdata, //内容
{
'!ref': outputPos[0] + ':' + outputPos[outputPos.length - 1] //设置填充区域
})
}
}; //创建二进制对象写入转换好的字节流
tmpDown = new Blob([s2ab(XLSX.write(tmpWB,
{bookType: (type == undefined ? 'xlsx':type),bookSST: false, type: 'binary'}//这里的数据是用来定义导出的格式类型
))], {
type: ""
}); var href = URL.createObjectURL(tmpDown); //创建对象超链接
document.getElementById("downloadA").href = href; //绑定a标签
document.getElementById("downloadA").click(); //模拟点击实现下载
setTimeout(function() { //延时释放
URL.revokeObjectURL(tmpDown); //用URL.revokeObjectURL()来释放这个object URL
}, 100);
} //字符串转字符流
function s2ab(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]。
function getCharCol(n) {
let temCol = '',
s = '',
m = 0
while (n > 0) {
m = n % 26 + 1
s = String.fromCharCode(m + 64) + s
n = (n - m) / 26
}
return s
}
</script>
</body>
</html>
2、导出结果
3、导入excel
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js导入excel</title>
</head>
<body>
<input type="file"onchange="importf(this)" />
<div id="excelContent"></div>
<script src="xlsx.full.min.js"></script>
<script>
/**
* FileReader共有4种读取方法：
* 1.readAsArrayBuffer(file)：将文件读取为ArrayBuffer。
* 2.readAsBinaryString(file)：将文件读取为二进制字符串
* 3.readAsDataURL(file)：将文件读取为Data URL
* 4.readAsText(file, [encoding])：将文件读取为文本，encoding缺省值为'UTF-8'
*/
var wb;//读取完成的数据
var rABS = false; //是否将文件读取为二进制字符串 //开始导入
function importf(obj) {
if(!obj.files) {
return;
}
var f = obj.files[0];
var reader = new FileReader();
reader.onload = function(e) {
var 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 excelJson = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
document.getElementById("excelContent").innerHTML= JSON.stringify( excelJson );
};
if(rABS) {
reader.readAsArrayBuffer(f);
} else {
reader.readAsBinaryString(f);
}
} //文件流转BinaryString
function fixdata(data) {
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;
}
</script>
</body>
</html>
4、导入结果
JS导出、导入EXCEL(案例)的更多相关文章
- .Net MVC 导入导出Excel总结(三种导出Excel方法，一种导入Excel方法) 通过MVC控制器导出导入Excel文件(可用于java SSH架构)
.Net MVC 导入导出Excel总结(三种导出Excel方法,一种导入Excel方法) [原文地址] 通过MVC控制器导出导入Excel文件(可用于java SSH架构) public cl ...
- DevExpress XtraGrid 数据导出导入Excel
// <summary> /// 导出按钮 /// </summary> /// <param name="sender"></param ...
- C# winform 导出导入Excel/Doc 完整实例教程[网上看到的]
还真没做过winform的导出导入,今天上网百度了一下.结果--- 所以还是我自己写个吧.之前做过web的,半搬半做就OK. 1添加引用:Aspose.Cells.dll(我们就叫工具包吧,可以从网上 ...
- asp.net core导出导入excel
使用NPOI导入导出excel,已经封装好Action可以直接调用 导出 效果图 使用方法 定义导出实体 class Student { public int Id { get; set; } pub ...
- 用PHPExcel导出导入Excel
thinkPHP5.0框架 查询数据库调用Excel方法 public function exportlist(){ $orderModel = new OrderModel(); if($start ...
- asp.net Mvc Npoi 导出导入 excel
因近期项目遇到所以记录一下: 首先导出Excel : 首先引用NPOI包 http://pan.baidu.com/s/1i3Fosux (Action一定要用FileResult) /// < ...
- php利用PHPExcel类导出导入Excel用法
PHPExcel类是php一个excel表格处理插件了,下面我来给大家介绍利用PHPExcel类来导入与导出excel表格的应用方法,有需要了解的朋友不防参考参考(PHPExcel自己百度下载这里不介 ...
- js导出成excel
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- C# WinForm 导出导入Excel/Doc 完整实例教程[使用Aspose.Cells.dll]
[csharp] view plain copy 1.添加引用: Aspose.Cells.dll(我们就叫工具包吧,可以从网上下载.关于它的操作我在“Aspose.Cells操作说明 中文版 下载 ...
随机推荐
- hdu 3790 最短路径dijkstra（多重权值）
最短路径问题 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Subm ...
- jar类库加载顺序
当我们启动一个tomcat的服务的时候,jar包和claess文件加载顺序: 1. $java_home/lib 目录下的java核心api 2. $java_home/lib/ext 目录下的jav ...
- Linux每日练习-crontab
- mybaits入门学习
学习了简单的mybatis的配置 Bean层: 这个都会很简单 一个完整的Bean 需要getter和setter方法还需要一个空的构造方法和一个满的构造方法. Dao层: 创建一个接口就ok了 pa ...
- TX2-刷机完成后安装程序ubuntu_linux命令&TX2学习总结
Linux教程|菜鸟教程:http://www.runoob.com/linux/linux-tutorial.html 认识linux:ping命令:ping命令是常用的网络命令ping网关:pin ...
- 18 —— node 热部署工具 — supervisor /nodemon 。
1,全局安装: npm install -g supervisor 2,使用: —————————————————————————————— nodemon 和 supervisor 流程一致.
- bzoj 4300绝世好题
呵呵呵呵 #include<bits/stdc++.h> #define INF 0x7fffffff #define LL long long #define N 100005 usin ...
- Pycharm2020最新激活码|永久激活（附最新激活码和插件）
最近很多人的Pycharm激活时间又过期了,后台很多人索要激活码,我就再把激活的方法汇和工具再梳理一次给大家. 最主要有两种激活方式(两种方式需要的激活码不同): 一.激活码激活: 一般一年多需要激活 ...
- java集合对象实现原理
1.集合包 集合包是java中最常用的包,它主要包括Collection和Map两类接口的实现. 对于Collection的实现类需要重点掌握以下几点: 1)Collection用什么数据结构实现? ...
- qt 程序发布打包
1. 首先把 release 版本的 exe 复制到其他文件夹,比如 Desktop\test 2. 使用开始菜单中 qt 里面的控制台窗口,使用 cd 命令打开到 Desktop\test 位置,然 ...