Layer文件上传操作
1:upload.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" href="./layui/css/layui.css" media="all">
</head>
<body>
<div class="layui-container">
<div class="layui-row" align="center" style="margin-top: 30px;">
<button type="button" class="layui-btn" id="upload">
<i class="layui-icon"></i>选择文件</button>
</div>
<div class="layui-row" align="center" style="margin-top: 30px;">
<textarea id="result" cols="50" rows="10"></textarea>
</div>
</div>
</body> <script src="./jquery/jquery.min.js"></script>
<script src="./layui/layui.js"></script> <script>
layui.use('upload', function(){
var upload = layui.upload; //执行上传
var uploadInst = upload.render({
elem: '#upload' //绑定元素
,url: '/ssfwpt/ra/ramanage' //上传接口
,method: 'POST'
,accept: 'file'
,size: 50
,before: function(obj){
layer.load();
}
,done: function(res){//上传完毕回调
layer.closeAll('loading');
var result = ''; for(var i=0; i<res.length; i++){
result = result + res[i].nsrsbh+"="+res[i].container+"\n";
} $("#result").html(result);
}
,error: function(){//请求异常回调
layer.closeAll('loading');
layer.msg('网络异常,请稍后重试!');
}
});
});
</script>
</html>
2:后台(Spring-boot)
/**
* 实现文件上传
* */
@RequestMapping(value = "/ramanage", method = RequestMethod.POST)
@ResponseBody
public List<Map<String,String>> ramanage(@RequestParam("file") MultipartFile file){
List<Map<String,String>> result = new ArrayList<>(); try {
InputStream input = file.getInputStream(); Workbook wb = new HSSFWorkbook(input); Sheet sheet = wb.getSheetAt(0); int rowNum = sheet.getLastRowNum()+1; Map<String,String> map;
for(int i=1; i<rowNum; i++){
Row row = sheet.getRow(i); //容器名称
Cell containerCell = row.getCell(0);
String container = containerCell.getStringCellValue(); //税号
Cell nsrsbhCell = row.getCell(1);
String nsrsbh = nsrsbhCell.getStringCellValue(); map = new HashMap<>();
map.put("nsrsbh", nsrsbh);
map.put("container", container); result.add(map);
}
} catch (IOException e) {
e.printStackTrace();
} return result;
}
Layer文件上传操作的更多相关文章
- python-web自动化-文件上传操作(非input标签的上传,需要借助第三方工具)
文件上传操作 一.文件上传分两种情况:1. 如果是input可以直接输入路径的,可以直接调send_keys输入路径 2. 非input标签的上传,需要借助第三方工具: 2.1 Autolt 需 ...
- ui自动化chrome文件上传操作
web自动化,再chrome浏览器中文件上传操作
- PHP多文件上传操作
在前一篇文章里讲到了关于PHP文件上传原理和简单操作举例是单文件上传. http://www.cnblogs.com/lichenwei/p/3879566.html 其实多文件上传和单文件上传大同小 ...
- jsp 文件上传操作
文件上传 1:完成一个文件上传的功能 index.jsp 注意更换form表单的enctype enctype就是encodetype就是编码类型的意思. multipart/form-data是指表 ...
- python - web自动化测试 - 文件上传操作
# 12. 上传操作## (1)如果是input可以直接输入路径的,直接使用send_keys输入路径# (2)非input标签的,需要借助第三方工具:# A. AutoIt : 调用其生成的au3或 ...
- 基于python的selenium两种文件上传操作
方法一.input标签上传 如果是input标签,可以直接输入路径,那么可以直接调用send_keys输入路径,这里不做过多赘述,前文有相关操作方法. 方法二.非input标签上传 这种上传方 ...
- Layer文件上传同时传递表单数据
(1)index.html <!DOCTYPE html> <html> <head> <title>TODO supply a title</t ...
- SVN库文件上传操作步骤
SVN库文件上传步骤: 1,sv st 或 svn status 查看本地库与远程库的差别(M代表文件有修改,?代表目录中有文件本地新增加) 2,根据1步骤中的查看结果:svn diff 差异文 ...
- 彻底搞懂HTML5文件上传操作需要的相关资料
https://developer.mozilla.org/zh-CN/docs/Web/GuideMDN Web Guide https://developer.mozilla.org/zh-CN/ ...
随机推荐
- Unity3d-Particle System系统的学习(二)
这节我们继续上节没讲完的Particle参数. 上节我们讲了Emission发射器参数,我们接着往下讲Shape: 可以看到这个子模块的参数是跟形状有关: 1.Shape:发射形状.粒子被约束在这个形 ...
- Android组件化之终极方案
Android组件化项目地址:Android组件化项目AndroidModulePattern Fragment或View如何支持组件化 如何管理组件 Fragment或View如何支持组件化 距离 ...
- [Android Pro] 自己动手编译Android源码(超详细)
cp from : https://www.jianshu.com/p/367f0886e62b 在Android Studio代码调试一文中,简单的介绍了代码调试的一些技巧.现在我们来谈谈andro ...
- js中__proto__和prototype constructor 的区别和关系
https://www.zhihu.com/question/34183746 javaScript原型.原型链的定义? prototype:每个函数都有一个prototype(显式原型),这个属性是 ...
- Unreal Engine 4 减少编辑器的帧率
默认的,打开UE4的编辑器,显卡会以全速渲染场景,在我的机器上.是120FPS. 整个机器就開始轰鸣了.资源占用太凶了.事实上全然不是必需这样,帧率在60左右就足够了. 那怎么改动呢,试了非常多办法. ...
- 第三章 logstash - 输入插件之tcp与redis
常用的输入插件: tcp redis 一.tcp 1.用法 input { tcp { port => 4560 codec => json_lines mode => server ...
- iOS蓝牙空中升级(固件升级)
空中升级又叫固件升级,指你手机从服务器下载下来的包或者数据,通过蓝牙传输给你的外设升级固件.如果你能把蓝牙的基础搞懂,其实也并不是很难,我在这里只不过提供一下思路. 空中升级略难的地方在于数据处理和交 ...
- ubuntu下nodejs开发环境搭建
1.安装nodejs sudo apt install -y nodejs 2.更新npm到最新版本 sudo npm i -g npm 3.npm配置为淘宝镜像 sudo npm config se ...
- WCF创建简单程序
1. 新建立空白解决方案,并在解决方案中新建项目,项目类型为:WCF服务应用程序.建立完成后如下图所示: 2.删除系统生成的两个文件IService1.cs与Service1.svc,当然你也可以直接 ...
- 【Scala】Scala多线程-并发实践
Scala多线程-并发实践 scala extends Thread_百度搜索 scala多线程 - 且穷且独立 - 博客园 Scala和并发编程 - Andy Tech Talk - ITeye博客 ...