如何利用html中的input=file上传文件

康康浪丶 2018-04-28 09:07:21

最近在写毕业设计，要求一次性上传多个类型不一样的文件，求大神指教。
具体要求是：在一个form表单中共有1个select和6个input（其中前2个为普通文本输入，后4个位文件类型），然后需要将form表单中的7个内容都上传，其中后4个文件类型的input中每一个input要上传多个同一类型的文件，但每一个input要上传的文件类型是不同的（第1个input要上传的文件类型为视频，后3个为word文档或ppt等）。
其中前台jsp代码为：



<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<script src="js/jquery-2.2.4.min.js"></script>

<title>添加课程</title>

</head>

<body>

	<form action="courseController/uploadCourse" method="post" enctype="multipart/form-data">

		<br/>

		<select name="subject" id="subject">

			<option>请选择所属学科</option>

		</select>

		<br/>

		<input name="type" type="text" placeholder="请填写具体课程方向" maxlength="15">

		<br/>

		请输入课程名：<input name="name" type="text" placeholder="请输入课程名"/>

		<br />

		请选择要上传的课程视频：<input type="file" accept="video/*" multiple/>

		<br/>

		请选择上传课件资源：<input type="file" accept=".pptx,.ppt,.doc,.docx,,.pdf" multiple/>

		<br/>

		请选择要上传的课后习题：<input type="file" accept=".pptx,.ppt,.doc,.docx,,.pdf" multiple/>

		<br/>

		请选择要上传的课后习题答案：<input type="file" accept=".pptx,.ppt,.doc,.docx,,.pdf" multiple/>

		<br/>

		<input type="submit" value="提交"/>

	</form>

</body>



<script type="text/javascript">

	window.load = loadSubject();

	

	//加载数据库中的subject表中的所有课程

	function loadSubject(){

		$.ajax({

			url : "courseController/listCourse",

			datatype : "json",

			type : "post",

			success:function(result){

				if(result.status == 0){

					var selDom = $("#subject");

					for(var i = 0;i < result.data.length;i++){

						selDom.append("<option value=" + result.data[i] + ">" + result.data[i] + "</option>");

					}

				}else{

					alert("啊哦，服务器开小差了！");

				}

			}

		});

	}

	

</script>

</html>

请求的后台Controller代码为：



@RequestMapping("/courseController/uploadCourse")

	public String uploadCourse2(HttpServletRequest request,HttpServletResponse response){

		FileItemFactory factory = new DiskFileItemFactory();

		ServletFileUpload fileUpload = new ServletFileUpload(factory);

		try {

			List<FileItem> list = fileUpload.parseRequest(request);

			for (FileItem fileItem : list) {

				// input的name属性

				String subject = null,type = null,name = null;

				if (fileItem.isFormField()) {

					String value = fileItem.getString("UTF-8");

					if(fileItem.getFieldName().equals("subject")){

						subject = value;

					}else if(fileItem.getFieldName().equals("type")){

						type = value;

					}else if(fileItem.getFieldName().equals("type")){

						name = value;

					}

				} else {

					String fileName = fileItem.getName();

					// 处理文件名绝对路径问题

					int index = fileName.lastIndexOf("\\");

					if (index != -1) {

						fileName = fileName.substring(index + 1);

					}

					String saveName = CommonsUtils.uuid() + "_" + fileName;

					File root = new File("D:/resources");

					String mimeType = fileItem.getContentType();

					String fileType = mimeType.substring(0, mimeType.indexOf("/"));

					File dirFile = new File(root, fileType);

					// 创建目录链

					dirFile.mkdir();

					File child = new File(dirFile, saveName);

					fileItem.write(child);

					//address.add(type + "/" + saveName);

					String saveAddresss = fileType + "/" + saveName;

				}

			}

		} catch (Exception e) {

			e.printStackTrace();

		}

		return "aaa";

	}

这样并没有实现要上传的文件保存到本地的D：/resources,百度了好久并未解决，求大神指教，谢谢了！

...全文

1118 3 打赏收藏转发到动态举报

写回复

用AI写文章

3 条回复

切换为时间正序

请发表友善的回复…

发表回复

kellymax 2019-06-17

打赏
举报

考虑异步吧，点击上传后就异步上传到服务器，返回文件所在的HTTP地址，放在隐藏框里然后整体保存时，只是保存基本的数据，这样就算是把文件与表单分开保存了

舍得Lcon 2018-04-28

打赏
举报

可以把需要上传的文件的name属性定义成一样的后台通过request去获取所有的属性值保存到一个List<MultipartFile>集合中 /** * 多文件上传 */ @RequestMapping(value = "/multifileUpload", method = RequestMethod.POST) public @ResponseBody String multifileUpload(HttpServletRequest request) { List<MultipartFile> multipartFiles = ((MultipartHttpServletRequest) request).getFiles("fileName"); if (multipartFiles.isEmpty()) { return "false"; } String path = "F:/file"; for (MultipartFile file : multipartFiles) { String fileName = file.getOriginalFilename(); int size = (int) file.getSize(); if (file.isEmpty()) { return "false"; } else { File dest = new File(path + "/" + fileName); if (!dest.getParentFile().exists()) { dest.getParentFile().mkdir(); } try { file.transferTo(dest); } catch (IOException e) { e.printStackTrace(); return "false"; } } } return "true"; } 不知道对你有没有用