jQuery文件上传以及MultipartFile

本文介绍: 这种写法可以省略很多html 代码，使得页面结构在编码时显得简单易懂，大部分工作都交由javascript来完成，尤其因为去掉了form 标签，所以得使用 javascript的FormDa ta来手动构建表单对象，文件的二进制数据可以直接使用jQue ry来获取到，然后再通过 ajax 提交到服务端即可。这种方式写form 标签必须要有，并且必须要有action、method、和e nc type 属性，且entype 属性值必须为multipart/form–data，这样后台才会认为这是一个二进制文件进行接收。

前端 写法

1.直接使用 html 原生表单

&lt;form action="/demo/upload2" method="POST" enctype="multipart/form-data"&gt;
    &lt;input id="file" type="file" name="mFile"/&gt;
    <input type="submit" value="上传"/>
</form>

这种方式写form 标签必须要有，并且必须要有action、method、和e nc type 属性，且entype 属性值必须为multipart/form–data，这样后台才会认为这是一个二进制文件进行接收。

2.直接使用 javascript来获取 html 标签中文件的值
html：

<input id="file" type="file" name="mFile"/>
<input type="button" onclick="upload()" value="上传">

javascript:

function upload() {
var formData = new FormData();
formData.append("mFile",$("#file")[0].files[0]);
$.ajax({
    url: "/demo/upload2",
    type: 'POST',
    data: formData,
    processData: false,
    contentType:false,
    success : function(data) {
        console.log(data);
    }
  });
}