java前端ajax提交数据_Java 前端使用Ajax通过FormData传递文件和表单数据到后台

提交

1，当仅仅想上传文件到后台

function tijiao(){

var file = $("#image")[0].files[0];

//打印file 为对象

console.log(file);

var formObj = new FormData();

formObj.set('image', file);

$.ajax({

url:'test/test3',

data:formObj,

type: 'POST',

dataType:'json',

processData:false,

contentType:false,

success:function(data){

alert(data.Msg);

}

});

}

@RequestMapping("/test3")

public Map test3( @RequestParam("image") MultipartFile uploadFile)

2.上传表单数据和文件

var uploadFile = new FormData($("#testform")[0]);

console.log(uploadFile);

$.ajax({

url:"test/test3",

type:"post",

data:uploadFile,

cache: false,

dataType:'json',

contentType: false, //不设置内容类型

processData: false, //不处理数据

success:function(data){

alert(data.Msg);

}

});

@RequestMapping("/test3")

public Map test3(Test test3, @RequestParam("image") MultipartFile uploadFile)//Test为实体类

3.上传多个表单数据，那么以json形式上传。

function tijiao(){

var file = $("#image")[0].files[0];

//打印file 为对象

console.log(file);

var formObj = new FormData();

formObj.set('image', file);

var formStr = JSON.stringify($('#testform').serializeJSON());

formObj.set('test3', formStr);

console.log(formObj);

$.ajax({

url:"test/test3",

type:"post",

data:formObj,

cache: false,

dataType:'json',

contentType: false, //不设置内容类型

processData: false, //不处理数据

success:function(data){

alert(data.Msg);

}

});

}

@RequestMapping("/test3")

public Map test3(String test3, @RequestParam("image") MultipartFile uploadFile)

2.上传表单数据和文件

标签：test3,Java,formObj,FormData,Ajax,file,false,data,image

来源： https://blog.csdn.net/qq_37686250/article/details/97272127