js-xlsx 前段读取excel
JavaScript读取和导出excel示例(基于js-xlsx)
放入参考链接 http://demo.haoji.me/2017/02/08-js-xlsx/
github官网 https://github.com/SheetJS/sheetjs
需要引入js
直接上代码
<a class="btn btn-info" onclick="selectFile()">
<input type="file" id="file" style="display:none;" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet">
<i class="fa fa-plus"></i> <@ctx.i18n text = "导入Excel"/>
</a>
此代码段是有关 读取xls的所有函数
function selectFile() {
document.getElementById('file').click();
}
// 读取本地excel文件
function readWorkbookFromLocalFile(file, callback) {
var reader = new FileReader();
reader.onload = function(e) {
var data = e.target.result;
var workbook = XLSX.read(data, {type: 'binary'});
if(callback) callback(workbook);
};
reader.readAsBinaryString(file);
}
function readWorkbook(workbook) {
var sheetNames = workbook.SheetNames; // 工作表名称集合
var worksheet = workbook.Sheets[sheetNames[0]]; // 这里我们只读取第一张sheet
var csv = XLSX.utils.sheet_to_csv(worksheet);
csv2table(csv);
}
// 将csv转换成表格
function csv2table(csv)
{
var rows = csv.split('\n');
rows.shift();
rows.pop();
rows.forEach(function(row, idx) {
var count = $("#bootstrap-table").bootstrapTable('getData').length;
var columns = row.split(',');
var rowinfo = {
index:count+1
,invCode: columns[0]
,invName: columns[1]
,number: columns[3]
,unites: columns[5]
,singlePrice: 0
,size: columns[2]
,material: columns[4]
,remark: ""
};
$("#bootstrap-table").bootstrapTable('append', rowinfo)
});
}
$(function() {
document.getElementById('file').addEventListener('change', function(e) {
var files = e.target.files;
if(files.length == 0) return;
var f = files[0];
if(!/\.xlsx$/g.test(f.name)) {
alert('仅支持读取xlsx格式!');
return;
}
readWorkbookFromLocalFile(f, function(workbook) {
readWorkbook(workbook);
});
});
});
js-xlsx 前段读取excel的更多相关文章
- js/ts/tsx读取excel表格中的日期格式转换
const formatDate = (timestamp: number) => { const time = new Date((timestamp - 1) * 24 * 3600000 ...
- excel保存为制表符分隔的文本文件 js无法完整读取
excel保存为制表符分隔的文本文件 js无法完整读取 excel另存为文本有两个选项,一个是制表符分隔的文本文件,一个是unicode文本.生成的文件Unicode更大一些.但是这里需要注意的是[制 ...
- java的poi技术读取Excel[2003-2007,2010]
这篇blog主要是讲述java中poi读取excel,而excel的版本包括:2003-2007和2010两个版本, 即excel的后缀名为:xls和xlsx. 读取excel和MySQL相关: ja ...
- java的poi技术读取Excel数据
这篇blog主要是讲述java中poi读取excel,而excel的版本包括:2003-2007和2010两个版本, 即excel的后缀名为:xls和xlsx. 读取excel和MySQL相关: ja ...
- java的poi技术读取Excel[2003-2007,2010]
这篇blog主要是讲述java中poi读取excel,而excel的版本包括:2003-2007和2010两个版本, 即excel的后缀名为:xls和xlsx. 读取excel和MySQL相关: ja ...
- python接口自动化(三十七)-封装与调用--读取excel 数据(详解)
简介 在进行软件接口测试或设计自动化测试框架时,一个不比可避免的过程就是: 参数化,在利用python进行自动化测试开发时,通常会使用excel来做数据管理,利用xlrd.xlwt开源包来读写exce ...
- node使用xlsx导入导出excel
1.安装和引入xlsx 安装 npm install xlsx 引入:let xlsx = require('xlsx');2.读取excel数据function readFile(file) { ...
- 关于jquery js读取excel文件内容 xls xlsx格式 纯前端
附带参考:http://blog.csdn.net/gongzhongnian/article/details/76438555 更详细导入导出:https://www.jianshu.com/p/7 ...
- node.js、js读取excel、操作excel、创建excel之js-xlsx.js
node.js篇 第一步引入包 npm install xlsx -save 第二步使用 var xl =require('xlsx'); //workbook 对象,指的是整份 Excel 文档.我 ...
- 实现js读取Excel数据
如何通过js去读取excel中的数据 <!DOCTYPE html> <html lang="en"> <head> <meta char ...
随机推荐
- 卷积神经网络CNN实战:MINST手写数字识别——调用模型/模型预测
import torch import torchvision.transforms as transforms from PIL import Image import numpy as np im ...
- OpenCV开发笔记(七十九):基于Stitcher类实现全景图片拼接
前言 一个摄像头视野不大的时候,我们希望进行两个视野合并,这样让正视的视野增大,从而可以看到更广阔的标准视野.拼接的方法分为两条路,第一条路是stitcher类,第二条思路是特征点匹配. 本篇使 ...
- B 端产品未来几年的发展趋势
在当今数字化高速发展的时代,B 端产品经理作为企业数字化转型的关键推动者,肩负着重大的责任.不仅要深入了解企业的业务需求,还要紧跟技术发展的步伐,为企业提供高效.创新的解决方案.那么,未来几年,B 端 ...
- SpringMVC:域对象共享数据
SpringMVC:域对象共享数据 使用ServletAPI向request域对象共享数据 @RequestMapping("/testServletAPI") public St ...
- 【YashanDB数据库】yasql登录有特殊字符@导致无法登录
问题备机 Linux bash shell环境下,使用yasql登录数据库没有使用转义导致登录失败.报错信息如下 问题分析 linux特殊字符转义问题,多加几层转义可以解决问题. 解决办法 su - ...
- vue3 modifier
vue3 modifier 是什么? modifier 中文意思为修饰符. 在vue3中主要是体现在v-model上,vue3允许我们添加自定义修饰符. 比如说这样: <template> ...
- ASP.NET Core Library – Google libphonenumber (Country Dial Code)
前言 Google libphonenumber 是 Java 的, ASP.NET Core 只是 port 过去而已. 以前在 angular2 学习笔记 ( translate, i18n 翻译 ...
- CSS – Transform
前言 之前写的 W3Schools 学习笔记 (3) – CSS 2D Transforms. 这篇作为整理. 参考: Youtube – Learn CSS Transform In 15 Minu ...
- Asp.net core 学习笔记之 authentication + authorization + identity + identity server 4 + angular 第六篇 (authorization 之 simple authorization, role based, claim based, policy based)
authorization 授权是什么 ? 就是某个人必须符合某些条件才能做某些事儿 某个人指的是登入的 user 某些条件指的是 policy requirements 事儿指的是访问 contro ...
- AJAX——简介
AJAX 同步与异步 AJAX 快速入门