我需要通过ajax发送图像,但不需要提交表单。通常,通过表单提交,我通过$_FILES['images']['tmp_name']获取图像;我试图发送文件,但我进入了数组对象FileList,无法获取文件。我错了什么?
html
<div class="col-12 col-sm-6 pt-sm-3 formimgaj" enctype="multipart/form-data">
<div class="form-group">
<input type="file" name="images" accept="image/*" class="form-control-file">
<input class="btn btn-sm btn-success butt_img_upload" value="upload">
</div> </div>
js
$( '.formimgaj' ).each( function () {
var forminput = $( ".form-control-file", this );
$(this).find( ".butt_img_upload" ).on( 'click', function ( e ) {
e . preventDefault();
var form_data = new FormData();
form_data.append('images[]', forminput[0].files );
form_data.append('type', 'updateimg');
new Response(form_data).text().then(console.log)
$.ajax({
type: 'post',
url: 'php/update.php',
data: form_data,
processData: false,
contentType: false,
cache: false,
success: function ( data ) {
console.log(data);
}
})
})
});
日志
Array
(
[images] => Array
(
[0] => [object FileList]
)
[type] => updateimg
)
谢谢
您需要循环使用forminput[0].files
中的所有值,并将它们作为单独的项添加到form_data
中。不能将FileList
对象直接放入FormData
参数中,它会被转换为字符串。
$('.formimgaj').each(function() {
var forminput = $(".form-control-file", this);
$(this).find(".butt_img_upload").on('click', function(e) {
e.preventDefault();
var form_data = new FormData();
for (let i = 0; i < forminput[0].files.length; i++) {
form_data.append('images[]', forminput[0].files[i]);
}
form_data.append('type', 'updateimg');
new Response(form_data).text().then(console.log)
$.ajax({
type: 'post',
url: 'php/update.php',
data: form_data,
processData: false,
contentType: false,
cache: false,
success: function(data) {
console.log(data);
}
})
})
});