不知道ajax 是如何上傳多圖發送給後台的。
單一圖片的話可以用base64發送給後台， 但是如果多圖用這個方法就不適宜了，因為base64會很大。
用什麼方式傳送給後台的？後台如果是PHP 是如何接收？
根據評論的方法，明明選擇了2張圖片上傳。為什麼後台只顯示1個檔案？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="//cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<form id="form">
<input type="file" multiple="" name="file">
<button id="btn" type="button">上传</button>
</form>
<script>
document.getElementById('btn').onclick = () => {
$.ajax({
url: './test.php',
type: 'POST',
dataType: 'text',
data: new FormData(document.getElementById('form')),
processData: false,
contentType: false,
})
.done(function(data) {
console.log(data);
})
}
</script>
</body>
</html>
三叔2017-06-26 10:57:20
還是用表單吧，你選擇直接ajax的原因應該是不想刷新頁面，
這樣的話可以使用formdata進行ajax提交，這是一個H5的新屬性，具體的可以看看實例，它最主要的功能就是將表單域裡的內容封裝成formdata，然後用ajax提交出去，表單控制項的name對應後台的參數name，至於多個圖片就用一組相同name的input就可以了。下面是js和效果圖，還要不懂的話可以追問。 
伊谢尔伦2017-06-26 10:57:20
使用FormData提交就可以了
funUploadFile: function(form, files) {
var that = this;
var formData = new FormData(form[0]);
for (var i = 0; i < files.length; i++) {
formData.append('file[' + i + ']', files[i]);
}
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
var data = JSON.parse(xhr.responseText);
//提交返回
}
}
//侦查当前附件上传情况
xhr.upload.onprogress = function(evt) {
var loaded = evt.loaded;
var tot = evt.total;
var per = Math.floor(100 * loaded / tot); //已经上传的百分比
// console.log(per);
}
xhr.open("post", 上传地址);
xhr.send(formData);
}曾经蜡笔没有小新2017-06-26 10:57:20
function httpUpload(url, formData) {
//formData.append("_token", window._token);
return new Promise(function (resolve, reject) {
$.ajax({
url: url,
type: 'POST',
data: formData,
processData: false,
contentType: false,
dataType: "json",
success: function (response) {
resolve(response);
},
error: function (response) {
reject(response);
}
});
});
}https://developer.mozilla.org...
主要就是將要上傳的檔案往formData裡面append
後端該怎麼取就怎麼取(php: $_FILES裡面)
