<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>导入</title>
</head>
<body>
<script>
var wb;//读取excel数据
var rABS=false;//是否将文件读取为二进制字符串
var exelTab=[];//获取到的表格数组
var file=document.getElementById("file").get(0);//得到文件对象
importf(file)//调用读取操作
function importf(obj){
if(!obj.file){
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"})
}
// 数据出口
excelTab=XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
// 定义参数
let list_RFIS=[];
var a={
a0:"物料编号"
}
excelTab.forEach(item=>
list_RFID.push(
{materialNumber:item[a.a0]}
)
);
// 发送请求参数:list_RFID
..................
...................
}
if(rABS){
reader.readAsArrayBuffer(f);
}else{
reader.readAsBinaryString(f);
} function fixdata(data){
let o="",l=0,w=10240;
for(;l<databyteLength;++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>

  

前端code导入excel的更多相关文章

  1. 前端json导入excel中

    ExportToExcel: function () { var param = {}; var _this = this; param.beginDate = $("#beginDate& ...

  2. 前端JS实现一键导入excel表格

    前面的文章中已经讲过关于js表格的导出,此文章主要说到的是excel文件如何导入到网页中,并在网页端显示. 代码部分: <!DOCTYPE html> <html> <h ...

  3. 从零开始实现放置游戏(六)——实现挂机战斗(4)导入Excel数值配置

    前面我们已经实现了在后台管理系统中,对配置数据的增删查改.但每次添加只能添加一条数据,实际生产中,大量数据通过手工一条一条添加不太现实.本章我们就实现通过Excel导入配置数据的功能.这里我们还是以地 ...

  4. 【图解】Web前端实现相似Excel的电子表格

     在本文中,我将用图解的方式用Wijmo(JavaScript库)中的SpreadJS来一步一步实现网页上的电子表格产品SpreadSheet(比如可构建Office 365 Excel产品.Go ...

  5. 使用纯前端JavaScript 实现Excel IO

    公司最近要为某国企做一个**统计和管理系统, 具体要求包含 Excel导入导出 根据导入的数据进行展示报表 图表展示(包括柱状图,折线图,饼图),而且还要求要有动画效果,扁平化风格 Excel导出,并 ...

  6. java基础之导入(Excel)2

    $(function(){ $("#linksCommonGrid").datagrid({ url:appPath+'/page/pageIndexMrgAct/queryPag ...

  7. 结合bootstrap fileinput插件和Bootstrap-table表格插件,实现文件上传、预览、提交的导入Excel数据操作流程

    1.bootstrap-fileinpu的简单介绍 在前面的随笔,我介绍了Bootstrap-table表格插件的具体项目应用过程,本篇随笔介绍另外一个Bootstrap FieInput插件的使用, ...

  8. springMVC(5)---导入excel文件数据到数据库

    springMVC(5)---导入excel文件数据到数据库 上一篇文章写了从数据库导出数据到excel文件,这篇文章悄悄相反,写的是导入excel文件数据到数据库.上一篇链接:springMVC(4 ...

  9. java实现导入excel功能

    实现功能: 1.Excel模板下载 2.导入excel 一.jsp效果和代码 <form id="uploadForm" target="frameFile&quo ...

随机推荐

  1. .Net Core HttpClient处理响应压缩

    前言     在上篇文章[ASP.NET Core中的响应压缩]中我们谈到了在ASP.NET Core服务端处理关于响应压缩的请求,服务端的主要工作就是根据Content-Encoding头信息判断采 ...

  2. 求求你们不要再用 RSA 私钥加密公钥解密了,这非常不安全!

    最近经常在网上看到有人说巨硬的 CNG(Cryptography Next Generation 即下一代加密技术) 只提供 RSA 公钥加密私钥解密,没有提供 RSA 私钥加密公钥解密,他们要自己封 ...

  3. 一篇看懂Socket开发

    Socket[套接字]是什么,对于这个问题,初次接触的开发人员一般以为他只是一个通讯工具. Socket接口是TCP/IP网络的API,Socket接口定义了许多函数或例程,程序员可以用它们来开发 T ...

  4. 2020-04-06:insert语句在mysql里经历了什么?

    1.会话状态转换为update 2.激活事物状态由 not_active 变为 active 3.查找定位数据 4.进行乐观插入 记录insert的undo记录记录undo的redo log 入red ...

  5. Vue 倒计时组件封装

    项目中需要用到倒计时的功能,封装了一个组件. 代码解读: 1:created周期中获取传入参数时间的剩余秒数: this.initSecondsLeft() 并绑定间隔事件 intervalEvent ...

  6. iMX283光盘资料 163网盘

    [光盘资料]EasyARM-i.MX280A_283A_287A V1.04(EasyARM-i.MX280A_283A_287A_cd).zip 提取码: y6pnW6sY

  7. MSDN 无法显示的问题 2010-03-21 21:08

    MSDN 无法显示的问题regsvr32 "C:\Program Files\Common Files\Microsoft Shared\Help\hxds.dll" .试图运行项 ...

  8. vue watch/ computed的应用(做一个简单的父子之间的传递/电话号码的搜索)

    父组件中当点击搜索的时候请求接口,然后把新的数据用 computed 传递给子组件 <van-search v-model="onSeachPhone" show-actio ...

  9. CSS动画实例:太极图在旋转

    利用CSS可以构造出图形,然后可以对构造的图形添加动画效果.下面我们通过旋转的太极图.放大的五角星.跳“双人舞”的弯月等实例来体会纯CSS实现动画的方法. 1.旋转的太极图 设页面中有<div ...

  10. JAVA-单例模式的几种实现方式

    一.什么是单例模式 单例:保证一个类仅有一个实例,并提供一个访问它的全局访问点. 单例模式是一种常用的软件设计模式之一,其目的是保证整个应用中只存在类的唯一个实例. 比如我们在系统启动时,需要加载一些 ...