在使用form表单的时候,一旦点击提交触发submit事件，一般会使得页面跳转，页面间的跳转等行为的控制权往往在后端，后端会控制页面的跳转及数据传递，但是在某些时候不希望页面跳转，或者说想要将控制权放在前端，或者想在前台接收支持IOS或安卓的json数据格式，这时候就需要使用ajax提交。
使用ajax实现文件上传：
--01：--导入文件上传的jar包：
<dependency><groupId>commons-fileupload</groupId><artifactId>commons-fileupload</artifactId><version>1.3</version></dependency><dependency><groupId>mons</groupId><artifactId>commons-lang3</artifactId><version>3.3.2</version></dependency><dependency><groupId>commons-io</groupId><artifactId>commons-io</artifactId><version>2.4</version></dependency>
--ajax提交form表单所以要返回json数据格式需要导入转换json的jar包
<!--转换JSON--><!-- /artifact/com.fasterxml.jackson.core/jackson-databind --><dependency><groupId>com.fasterxml.jackson.core</groupId><artifactId>jackson-databind</artifactId><version>2.9.5</version></dependency>
--编写文件上传的jsp中的表单，使用form提交文件上传需要使用二进制的方式传输所以不要忘了在form标签中添加：enctype="multipart/form-data"
<div style="align-items: center;align-content: center;"><h1>文件上传</h1><form id="form" method="post" enctype="multipart/form-data"><p>请选择要上传的文件:</p><input id="file" name="file" type="file" multiple="multiple"/><br><input id="upload" name="upload" type="button" value="上传"></form></div>
--编写提交文件上传的jq的ajax
<script type="text/javascript">$(window).ready(function () {$("#upload").click(function () {var formData = new FormData($("#form")[0]);//获取表单中的文件alert(formData);$.ajax({url:"upload",//后台的接口地址type:"post",//post请求方式data:formData,//参数cache: false,processData: false,contentType: false,success:function (data) {alert(data.newFileName);},error:function () {alert("操作失败~");}})});});</script>
--在springmvc的配置文件中配置MultipartResolver用于文件上传
<!-- 配置MultipartResolver,用于上传文件 --><bean id = "multipartResolver" class="org.springframework.monsMultipartResolver"><property name="defaultEncoding" value="utf-8"></property></bean>
--编写提交文件上传的jq的ajax
@RequestMapping("/upload")@ResponseBodypublic Object upload(MultipartFile[] file, HttpSession session) {System.out.println(file);//获取服务器上传的文件路径String dir = session.getServletContext().getRealPath("/upload");System.out.println(dir);Map<String,Object> map=new HashMap<>();for (MultipartFile files : file){System.out.println("文件类型:"+files.getContentType());//获取文件名String filename = files.getOriginalFilename();//获取文件的后缀名String suffix = filename.substring(filename.lastIndexOf(".") + 1);//给需要上传的文件起别并String newFileName=String.valueOf(System.currentTimeMillis())+"."+suffix;System.out.println("文件名:"+newFileName);System.out.println("文件后缀:"+suffix);System.out.println("文件大小:"+files.getSize()/1024+"KB");map.put("newFileName",newFileName);//创建要保存文件的路径File dirFile = new File(dir,filename);if (!dirFile.exists()){dirFile.mkdirs();}try {//将文件写入创建的路径files.transferTo(dirFile);System.out.println("文件保存成功~");} catch (IOException e) {e.printStackTrace();}}return map;}
注意：
在常用方式中，点击的登录按钮的type为"submit"类型；在常用方式中，form的action不为空；ajax方式中需要注意的是$.ajax方法中的参数：dataType和data
