<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="./jquery-1.8.3.min.js"></script>
</head>
<body>
<!-- 图片上传 -->
<form id="form">
<input type="file" name="pic[]">
<input type="file" name="pic[]">
<input type="file" name="pic[]">
<input type="file" name="pic[]">
</form>
<a id="add">提交</a>
</body>
</html>
<script>
// 这里没有写后台,只写了前端如何,获取到图片,然后使用ajax请求上传。
// 后台如何获取文件就如何,不需要做特殊处理
$('#add').click(function(){
var form = document.getElementById('form');
var formData = new FormData(form);
console.log('正在上传信息,请耐心等待!');
$.ajax({
url:"请求地址",
type:'POST',
data:formData,
contentType:false,//必须false才会自动加上正确的Content-Type
processData:false,//必须false才会避开jQuery对 formdata 的默认处理.XMLHttpR
success:function(data){
console.log(data);
},error:function(){
console.log('请求异常');
}
})
});
</script>