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操作说明 中文版 下载 ...
随机推荐
- 第十七篇 ORM跨表查询和分组查询---二次剖析
ORM跨表查询和分组查询---二次剖析 阅读目录(Content) 创建表(建立模型) 基于对象的跨表查询 一对多查询(Publish与Book) 多对多查询 (Author 与 Book) 一对一查 ...
- Python 内置类型 dict， list，线程安全吗
近段时间发现一个 Python 连接数据库的连接是线程不安全的,结果惹得我哪哪儿都怀疑变量的多线程是否安全的问题,今天终于找到了正确答案,那就是 Python 内置类型 dict,list ,tupl ...
- 启用sql日志
SHOW VARIABLES LIKE "general_log%"; -- 查询是否启用日志 SET GLOBAL general_log = 'ON'; -- 设置启用 SE ...
- HDU - 1200 To and Fro
题意:给定一个,其实是由一个图按蛇形输出而成的字符串,要求按从左到右,从上到下的顺序输出这个图. 分析: 1.把字符串转化成图 2.按要求输出图= = #include<cstdio> # ...
- HDU 5464：Clarke and problem
Clarke and problem Accepts: 130 Submissions: 781 Time Limit: 2000/1000 MS (Java/Others) Memory L ...
- ORACLE异库DBLink创建以及使用
遇到一个问题,两张库数据需要同步,但是数据量很大,落地迁移时间成本太大,这个时候找到一种方法就是DBLink 使用场景说明: A转移数据到B,需要在B上面创建此DBLink,然后使用. 创建方法: - ...
- Angular全局数据管理与同步更新
自定义实现angular中数据的状态管理,如有不妥请指正 一.先介绍一下rxjs中subject: Import {subject}from’rxjs’ Subject 数据的订阅与分发,结合报刊的发 ...
- DFS+BFS(广度优先搜索弥补深度优先搜索遍历漏洞求合格条件总数)--09--DFS+BFS--蓝桥杯剪邮票
题目描述 如下图, 有12张连在一起的12生肖的邮票.现在你要从中剪下5张来,要求必须是连着的.(仅仅连接一个角不算相连) 比如,下面两张图中,粉红色所示部分就是合格的剪取. 请你计算,一共有多少 ...
- UVALive 3977 BFS染色
这个题意搞了半天才搞明白 就是如果定义一个d-summit,即从该点到另一个更高的点,经过的路径必定是比当前点低至少d高度的,如果该点是最高点,没有比他更高的,就直接视为顶点 其实就是个BFS染色,先 ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习：语法
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...