JS导入Excel实战

原创 已于 2022-08-25 21:28:11 修改 · 1.2w 阅读 · 12 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#前端

于 2018-08-31 12:49:48 首次发布
博客主要讲述了下载ZIP文件并解压后得到xlsx.full.min.js的过程，与前端开发相关。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

70

70

70

下载ZIP后解压得到xlsx.full.min.js

<script src="${ctx}/static/js/lib/xlsx.full.min.js" type="text/javascript"></script>
<input type="file" id="import_Excel" style="display: inline;" onchange="importExcel(this)">
/**
 * 对导入的excel进行解析
 */
function importExcel(importExcel){
	//判断结论时准则不可以为空
	if (!$("#testSpec").val()) {
		helper.alertDialog("Test Spec can not be empty!","danger");
		$("#import_Excel").val("");
		return
	}
	if (!$("#measuredWiringCs").val()) {
		helper.alertDialog("Cross Section can not be empty!","danger");
		$("#import_Excel").val("");
		return
	}
	if (!$("#baseMaterial").val()) {
		helper.alertDialog("Terminal Base Material can not be empty!","danger");
		$("#import_Excel").val("");
		return
	}
	bootbox.confirm("<h4>Are you sure to select the excel?</h4>", function(result){
		if(result) {
			importExcelDataToReport(importExcel);
		} else {
			$("#import_Excel").val("");
		}
	});
}

/**
 * 将excel数据导入Report
 */
function importExcelDataToReport(importExcel){
	//获取导入的excel
	var excel = importExcel.files[0];
	//创建fileReader对象和其加载方法
	var fileReader = new FileReader();
	fileReader.onload = function(excel) {
		//获取工作簿
		var workbook = XLSX.read(excel.target.result, {type: 'binary'});
		//获取指定sheet页数据
		var pullForce_Rows = XLSX.utils.sheet_to_json(workbook.Sheets["Pull Force"]);
		var cableSealRetention_Rows = XLSX.utils.sheet_to_json(workbook.Sheets["Cable Seal Retention"]);
		var voltageDrop_Rows = XLSX.utils.sheet_to_json(workbook.Sheets["Voltage Drop"]);
		var electricalCurrentCycling_Rows = XLSX.utils.sheet_to_json(workbook.Sheets["Electrical Current Cycling"]);
		var env_Rows = XLSX.utils.sheet_to_json(workbook.Sheets["ENV"]);
		//填充选择的试验项对应的数据
		var testItems = $("#testItems").val();
		if (testItems.indexOf("Pull Force")!=-1) {
			//填充Pull Force数据
			for (var i = 0; i < pullForce_Rows.length; i++) {
				$("#pfcch1pf"+(i+1)).val(pullForce_Rows[i].拉力Force1);
				$("#pfcch2pf"+(i+1)).val(pullForce_Rows[i].拉力Force2);
				$("#pfcch3pf"+(i+1)).val(pullForce_Rows[i].拉力Force3);
				$("#pfcch4pf"+(i+1)).val(pullForce_Rows[i].拉力Force4);
				$("#pfcch5pf"+(i+1)).val(pullForce_Rows[i].拉力Force5);
			}
			//计算Pull Force结论
			$("#pfcch1pf1").blur();
			$("#pfcch2pf1").blur();
			$("#pfcch3pf1").blur();
			$("#pfcch4pf1").blur();
			$("#pfcch5pf1").blur();
		}
		if (testItems.indexOf("Cable Seal Retention")!=-1) {
			//填充Cable Seal Retention数据
			for (var i = 0; i < cableSealRetention_Rows.length; i++) {
				$("#ich1cabs"+(i+1)).val(cableSealRetention_Rows[i].拉力Force1);
				$("#ich2cabs"+(i+1)).val(cableSealRetention_Rows[i].拉力Force1);
				$("#ich3cabs"+(i+1)).val(cableSealRetention_Rows[i].拉力Force1);
			}
			//计算Cable Seal Retention结论
			$("#ich1cabs1").blur();
			$("#ich2cabs1").blur();
			$("#ich3cabs1").blur();
		}
		if (testItems.indexOf("Voltage Drop Version")!=-1) {
			//填充Voltage Drop数据
			for (var i = 0; i < voltageDrop_Rows.length; i++) {
				$("input[name='voltagedropCCH1.t_value"+(i+1)+"']").val(voltageDrop_Rows[i].总电压降1);
				$("input[name='voltagedropCCH1.s_value"+(i+1)+"']").val(voltageDrop_Rows[i].焊接样线压降1);
				$("input[name='voltagedropCCH2.t_value"+(i+1)+"']").val(voltageDrop_Rows[i].总电压降2);
				$("input[name='voltagedropCCH2.s_value"+(i+1)+"']").val(voltageDrop_Rows[i].焊接样线压降2);
				$("input[name='voltagedropCCH3.t_value"+(i+1)+"']").val(voltageDrop_Rows[i].总电压降3);
				$("input[name='voltagedropCCH3.s_value"+(i+1)+"']").val(voltageDrop_Rows[i].焊接样线压降3);
				$("input[name='voltagedropCCH4.t_value"+(i+1)+"']").val(voltageDrop_Rows[i].总电压降4);
				$("input[name='voltagedropCCH4.s_value"+(i+1)+"']").val(voltageDrop_Rows[i].焊接样线压降4);
				$("input[name='voltagedropCCH5.t_value"+(i+1)+"']").val(voltageDrop_Rows[i].总电压降5);
				$("input[name='voltagedropCCH5.s_value"+(i+1)+"']").val(voltageDrop_Rows[i].焊接样线压降5);
				//计算Voltage Drop结论
				$("input[name='voltagedropCCH1.t_value"+(i+1)+"']").blur();
				$("input[name='voltagedropCCH2.t_value"+(i+1)+"']").blur();
				$("input[name='voltagedropCCH3.t_value"+(i+1)+"']").blur();
				$("input[name='voltagedropCCH4.t_value"+(i+1)+"']").blur();
				$("input[name='voltagedropCCH5.t_value"+(i+1)+"']").blur();
			}
		}
		if (testItems.indexOf("Current Cycling Version")!=-1) {
			//填充Electrical Current Cycling数据
			for (var i = 0; i < electricalCurrentCycling_Rows.length; i++) {
				$("input[name='cchBeforeElec1.res"+(i+1)+"']").val(electricalCurrentCycling_Rows[i].试验前压接电阻1);
				$("input[name='cchBeforeElec1.voltage"+(i+1)+"']").val(electricalCurrentCycling_Rows[i].试验后压接电压降1);
				$("input[name='cchBeforeElec2.res"+(i+1)+"']").val(electricalCurrentCycling_Rows[i].试验前压接电阻2);
				$("input[name='cchBeforeElec2.voltage"+(i+1)+"']").val(electricalCurrentCycling_Rows[i].试验后压接电压降2);
				$("input[name='cchBeforeElec3.res"+(i+1)+"']").val(electricalCurrentCycling_Rows[i].试验前压接电阻3);
				$("input[name='cchBeforeElec3.voltage"+(i+1)+"']").val(electricalCurrentCycling_Rows[i].试验后压接电压降3);
				$("input[name='cchBeforeElec4.res"+(i+1)+"']").val(electricalCurrentCycling_Rows[i].试验前压接电阻4);
				$("input[name='cchBeforeElec4.voltage"+(i+1)+"']").val(electricalCurrentCycling_Rows[i].试验后压接电压降4);
				$("input[name='cchBeforeElec5.res"+(i+1)+"']").val(electricalCurrentCycling_Rows[i].试验前压接电阻5);
				$("input[name='cchBeforeElec5.voltage"+(i+1)+"']").val(electricalCurrentCycling_Rows[i].试验后压接电压降5);
			}
			//计算Electrical Current Cycling结论
			$("input[name='cchBeforeElec1.res1']").blur();
			$("input[name='cchBeforeElec1.voltage1']").blur();
			$("input[name='cchBeforeElec2.res1']").blur();
			$("input[name='cchBeforeElec2.voltage1']").blur();
			$("input[name='cchBeforeElec3.res1']").blur();
			$("input[name='cchBeforeElec3.voltage1']").blur();
			$("input[name='cchBeforeElec4.res1']").blur();
			$("input[name='cchBeforeElec4.voltage1']").blur();
			$("input[name='cchBeforeElec5.res1']").blur();
			$("input[name='cchBeforeElec5.voltage1']").blur();
		}
		if (testItems.indexOf("Voltage Drop ENV")!=-1) {
			//填充ENV数据
			for (var i = 0; i < env_Rows.length; i++) {
				$("input[name='envCCH1.a_value"+(i+1)+"']").val(env_Rows[i].试验前压接电阻1);
				$("input[name='envCCH1.b_value"+(i+1)+"']").val(env_Rows[i].热冲击试验后压接电压降1);
				$("input[name='envCCH1.c_value"+(i+1)+"']").val(env_Rows[i].温湿度循环试验后压接电压降1);
				$("input[name='envCCH2.a_value"+(i+1)+"']").val(env_Rows[i].试验前压接电阻2);
				$("input[name='envCCH2.b_value"+(i+1)+"']").val(env_Rows[i].热冲击试验后压接电压降2);
				$("input[name='envCCH2.c_value"+(i+1)+"']").val(env_Rows[i].温湿度循环试验后压接电压降2);
				$("input[name='envCCH3.a_value"+(i+1)+"']").val(env_Rows[i].试验前压接电阻3);
				$("input[name='envCCH3.b_value"+(i+1)+"']").val(env_Rows[i].热冲击试验后压接电压降3);
				$("input[name='envCCH3.c_value"+(i+1)+"']").val(env_Rows[i].温湿度循环试验后压接电压降3);
				$("input[name='envCCH4.a_value"+(i+1)+"']").val(env_Rows[i].试验前压接电阻4);
				$("input[name='envCCH4.b_value"+(i+1)+"']").val(env_Rows[i].热冲击试验后压接电压降4);
				$("input[name='envCCH4.c_value"+(i+1)+"']").val(env_Rows[i].温湿度循环试验后压接电压降4);
				$("input[name='envCCH5.a_value"+(i+1)+"']").val(env_Rows[i].试验前压接电阻5);
				$("input[name='envCCH5.b_value"+(i+1)+"']").val(env_Rows[i].热冲击试验后压接电压降5);
				$("input[name='envCCH5.c_value"+(i+1)+"']").val(env_Rows[i].温湿度循环试验后压接电压降5);
			}
			//计算ENV结论
			$("input[name='envCCH1.a_value1']").blur();
			$("input[name='envCCH1.b_value1']").blur();
			$("input[name='envCCH1.c_value1']").blur();
			$("input[name='envCCH2.a_value1']").blur();
			$("input[name='envCCH2.b_value1']").blur();
			$("input[name='envCCH2.c_value1']").blur();
			$("input[name='envCCH3.a_value1']").blur();
			$("input[name='envCCH3.b_value1']").blur();
			$("input[name='envCCH3.c_value1']").blur();
			$("input[name='envCCH4.a_value1']").blur();
			$("input[name='envCCH4.b_value1']").blur();
			$("input[name='envCCH4.c_value1']").blur();
			$("input[name='envCCH5.a_value1']").blur();
			$("input[name='envCCH5.b_value1']").blur();
			$("input[name='envCCH5.c_value1']").blur();
		}
		//清除选中的file文件使可以重新选择
		//$("#import_Excel").val("");
		//禁用excel使不可以重新选择
		//$("#import_Excel").attr("disabled",true);
	};
	//手动触发fileReader的加载方法
	fileReader.readAsBinaryString(excel);
}

70

 

vue 基于 exceljs 导出 excel实战示例
资深架构师分享：深入剖析软件架构，探讨云计算、微服务、大数据等前沿技术。分享实践经验，促进技术交流，共同构建卓越系统。
05-22 7188
背景 在做一个小东西，需要导出excel，之前导出excel 的方式都是在服务器端，生成excel然后在浏览器端进行下载，这次想进行在前端进行导出，基于这个需求在网上找了一些工具，这里会做一些对比 工具对比 名称 优点 缺点 活跃度 js-xlsx 支持nodejs服务端和兼容大多数浏览器导出，读写支持完美 社区版本不支持样式定制 15867 exceljs 支持nodejs服...
【vue导入导出Excel】vue简单实现导出和导入复杂表头excel表格功能【纯前端版本和配合后端版本】
2401_84433535的博客
04-27 1510
总结来说，面试成功=基础知识+项目经验+表达技巧+运气。我们无法控制运气，但是我们可以在别的地方花更多时间，每个环节都提前做好准备。面试一方面是为了找到工作，升职加薪，另一方面也是对于自我能力的考察。能够面试成功不仅仅是来自面试前的临时抱佛脚，更重要的是在平时学习和工作中不断积累和坚持，把每个知识点、每一次项目开发、每次遇到的难点知识，做好积累，实践和总结。开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】，但是我们可以在别的地方花更多时间，每个环节都提前做好准备。
JS导入Excel（IE）
11-28
JS导入Excel生成Table，只支持IE
JavaScript导入导出excel
baidu_36095053的博客
07-22 826
在JavaScript的浏览器环境下导入和导出Excel文件，主要可以通过一些库来帮助我们简化操作，比如SheetJS（也称为xlsx库）和。
JavaScript实现Excel导出功能详解
最新发布
weixin_31715353的博客
07-04 964
在处理Excel文件时，经常需要合并单元格以更好地展示数据结构，例如创建表头或汇总行。合并单元格的算法逻辑主要包括确定哪些单元格需要合并以及如何更新相关联的元数据以反映新的单元格结构。基本步骤包括：1. 确定合并的起始单元格和结束单元格。2. 更新这些单元格的样式属性，如边框。3. 保存合并范围的引用，以便在数据更新时重新计算合并区域。在实现算法时，需要考虑到合并单元格后，原本分散在多个单元格中的数据应如何处理。
使用js导入导出excel数据
04-03
点击index.html，导入文件，可以选择文件中“待导入的数据.xlsx”文件导入数据，也可以选择用户自己定义的文件，点击导出文件，即可导出文件
js 导入导出Excel
weixin_44937771的博客
07-18 2855
js 将数据导出为excel
JS实例:用javascript将数据导入Excel
02-04
JS实例:用javascript将数据导入Excel
.NET中使用进度条导入Excel的实战解析
"在.NET开发中，进度条是提升用户体验的重要工具，特别是在处理大量数据如导入Excel时。本文提供了一个实际的应用实例，演示如何在Web应用程序中使用进度条来跟踪并显示Excel导入的进度和状态。" 在.NET框架中，当...
Python+Requests+Excel接口测试实战_python接口测试导入excel
2401_84254567的博客
04-15 959
3、EXCEL中的数据读取成功后，然后我们需要对于读出来的数据进行相应的处理。当然示例中只是简单列了一下关于POST,GET等二种方式，实际还有很多其它方式，如put,delete等，请求中也还会包括headers，这些都可以自已添加上去。16 # 根据不同的访问方式来访问接口。24 print(‘失败’)32 # 获取返回信息的json数据。27 # 获取访问接口的状态码。27 # 以下是分别获取每一列的数值。
【项目实战SpringBoot+Vue】基于easyexcel实现Excel大数据量的导入导出（包含数据脱敏）--简单易上手
【实战】T-猿小白的博客
03-13 4267
SpringBoot2.7.9 + Vue2 + Element + easyexcel 实现大数据量的导入导出，脱敏数据展示、导出，多sheet页等复杂表单导入导出
Js前段js-xlsx 实现Excel文件导入导出功能
08-25
具体详细实施内容请见博客
js对excel导入解析与导出
11-01
js对excel表格的导入解析成table展示,可以对数据进行筛选处理等等,然后可以把把显示的table按照excel的格式导出
js读取Excel
08-01
纯前端利用 js-xlsx 实现 Excel 文件导入导出功能 js代码将Excel文件转化为json等
js完成Excel的导入及所需的控件
05-10
通过JS漂亮的完成了Excel的导入功能，当然导入所需的控件也包括了，因为之前用过了所以上传分享一下。
js前端读取EXCEL文件
12-01
非常不错的前端JS直接读取 Excel，值得一看。有完整的教学示例！
JS实现Excel导入以及table导出为Excel
qq_45308049的博客
02-05 3641
3.使用XLSX插件的XLSX.read()方法，将二进制字符串转换成excel文件的工作簿对象workbook（XLSX的具体使用方法请参考。4.通过XLSX.utils.sheet_to_json()方法，从workbook中获取第一张 Sheets表格数据并将其转换为json数据。2.通过XLSX插件的 XLSX.utils.book_new()方法，创建excel工作簿对象workbook。5.重组json数据生成数组，即是根据自己的定义的列字段名，重新组成符合自己需求的json数据。
js实现Excle批量导入
Pinkface_的博客
07-05 733
xml文件：数据库为oracles。
javascript 操作 excel 全攻略
C#,SQL,Castle,Hibernate,MVC,Spring.net
01-09 3583
最近做一个项目,用到了javascript操纵excel以生成报表,下面是标有详细注解的实例 function MakeExcel(){var i,j;    try {      var xls    = new ActiveXObject ( "Excel.Application" );     }    catch(e) {         alert( "要打印该表，您必须
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

童心同萌

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值