前台代码:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>图片上传</title>
</head>
<body>
<h2>File上传</h2>
<div class="file_class">
<form action="##" method="post" enctype="multipart/form-data" name="myform">
图片:<input type="file" name="upload" id="fileName"/><br/>
姓 名:<input type="text" name="name" id="name"/><br/>
身份证:<input type="text" name="idNumber" id="idNumber"/><br/>
<button class="btn" type="button" onclick="file_upload()"><i class="icon-ok"></i> 确定</button>
</form>
</div>
<script src="../../../resource/jqweui/js/jquery-2.1.4.js"></script>
<script type="text/javascript">
/*file上传按钮*/
function file_upload() {
var type = "file";
var formData = new FormData();//这里需要实例化一个FormData来进行文件上传
formData.append(type,$("#fileName")[0].files[0]);
formData.append("name",$("#name").val());
formData.append("idNumber",$("#idNumber").val());
console.log(formData);
$.ajax({
type: "post",
url: "url请求地址",
data: formData,
dataType: "json",
processData:false,
contentType: false,
success: function (data) {
if (data.resultMessage == "验证成功") {
alert("验证成功!");
}else{
alert("信息不匹配!");
}
},
error : function() {
alert("异常!");
}
});
}
</script>
</body>
</html>
后台接收:
@RequestMapping("url请求地址")
@ResponseBody
public String ctid_ids(@RequestParam MultipartFile file, String name, String idNumber,String filepath) throws Exception {
//逻辑处理
Map<String, String> end = new HashMap<String, String>();
return JsonTools.toJson(end);
}