<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<meta content="width=device-width, initial-scale=1" name="viewport" />
<script src="https://snipp.ru/cdn/jQuery-Form-Plugin/dist/jquery.form.min.js"></script>
<form id="js-form" method="post" enctype="multipart/form-data" >
<input id="js-file" type="file" name="file[]" multiple="multiple">
</form>
<div id="result">
<!-- Сюда выводится результат из uploads.php -->
</div>
<style type="text/css">
#result {
padding: 10px 0;
font-size: 15px;
}
.success {
color: green;
}
.error {
color: red;
}
</style>
<script>
$('#js-file').change(function () {
var $input = $("#js-file");
var fd = new FormData;
fd.append('img', $input.prop('files')[0]);
$.ajax({
url: 'post.php',
data: fd,
processData: false,
contentType: false,
type: 'POST',
success: function (data) {
alert(data);
}
});
});
</script><?php
$input_name = 'img';
ini_set('display_errors','Off');
echo var_dump($_FILES[$input_name]);
?>
$(function() {
$('#form-data').on('submit', function(e){
e.preventDefault()
var form = $(this); // Предположу, что этот код выполняется в обработчике события 'submit' формы
var data = new FormData(); // Для отправки файлов понадобится объект FormData. Подробнее про него можно прочитать в документации - https://developer.mozilla.org/en-US/docs/Web/API/FormData
// Сбор данных о файлах
var filesField = form.find('input[type="file"]');
var fileName = filesField.attr('name');
for(var i = 0; i < filesField.prop('files').length; i++){
var file = filesField.prop('files')[i];
data.append(fileName, file) ;
}
// Отправка данных
var url = 'upload.php';
$.ajax({
url: url,
type: 'POST',
data: data,
contentType: false,
cache: false,
processData:false,
success: function(response) {
console.log(response)
}
});
})
});