ajax多个filesajax多个filesajax多个filesajax多个filesajax多个filesajax多个files

CSDN首页
博客
课程
文库·商城
问答
社区
插件
认证
开源
ajax上传多个file文件
搜索

会员中心
足迹
动态
消息
创作
ajax多个files,jQuery实现异步上传一个或多个文件

隔壁王医生

于 2021-08-05 17:08:43 发布

170
收藏
文章标签： ajax多个files
本文实例为大家分享了jQuery实现异步上传一个或多个文件的具体代码，供大家参考，具体内容如下

首先使用SpringMvc文件上传，需要引入第三方上传文件的jar：

commons-fileupload

commons-fileupload

1.3.1

commons-io

commons-io

2.4

响应json需要导入的包：

com.fasterxml.jackson.core

jackson-databind

2.9.0

com.fasterxml.jackson.core

jackson-core

2.9.0

com.fasterxml.jackson.core

jackson-annotations

2.9.0

接下来看jsp文件：

首页
同步上传一个文件

异步上传一个文件

异步上传一个文件,且表单有其他数据

编 号:

账户名:

金 额:

异步上传多个文件,且表单有其他数据

编 号:

账户名:

金 额:

$(function () {undefined

//异步上传一个文件

$(“#sub”).click(function () {undefined

var file = new FormData($(“#formData”)[0]);

$.post({undefined

url:‘upload/testUpload’,

contentType:false, //jQuery不要去设置Content-Type请求头

processData:false, //jQuery不要去处理发送的数据

cache:false, //不缓存

dataType:‘json’, //返回类型json

data:file, //文件数据

success:function (res) {undefined

console.log(res);

}

});

});

//异步上传一个文件，带表单参数

$(“#sub2”).click(function () {undefined

//将form表单转换为FormData对象

var data = new FormData(document.querySelector(“#formData2”));

$.post({undefined

url:‘upload/testUpload2’,

contentType:false, //jQuery不要去设置Content-Type请求头

processData:false, //jQuery不要去处理发送的数据

cache:false, //不缓存

dataType:‘json’, //返回类型json

data:data, //表单数据

success:function (res) {undefined

console.log(res);

},

error:function (error) {undefined

console.log(error);

}

});

});

//异步上传多个文件，带表单参数

$(“#sub3”).click(function () {undefined

//将form表单转换为FormData对象

var data = new FormData(document.querySelector(“#formData3”));

$.post({undefined

url:‘upload/testUpload3’,

contentType:false, //jQuery不要去设置Content-Type请求头

process