如何使用fileData对象提取上传的文件（pdf）并通过AJAX将其发送到PHP页面？

Question

我已经尝试使用Javascript中的FormData()对象执行此操作。不知何故，它根本不适合我。我的代码如下：

HTML面：

<form method='POST' action='script_addRelatedFile.php' enctype='multipart/form-data' id="my-form"  class="ajax-submit" >    
<input name="order_addfile[]" type="file"  id='order_addfile'  />
<input type='submit' name='submit' id='submit' class="button button-big button-raised button-fill color-green  form-to-data-uploadFile" value='Upload File'/>

JavaScript面：

var fileInput = document.getElementById("order_addfile");
var postData = new FormData();
if (fileInput.files.length > 0) {
    console.log(fileInput.files[0]);
    file = fileInput.files[0];
    //console.log(file.name);
    postData.append('files', file);
    console.log(postData);
}   

//alert(test);
$.ajax({
    type: "POST",
    url: "script_addRelatedFile.php",
    //async: true,
    processData: false,
    //contentType: false,
    data: postData, //send: JSON.stringify(test), 
    success: function(data){
        //  console.log(data);
        //if(data) {
        //location.reload();
        //}
        alert(data);
        alert("Thanks for adding your file.");
    },
    error: function() {
        console.log('ajax loading error...');
        alert("error");
        //return false;
    }
});

[谁能告诉我我做错了什么吗，我的文件没有上传/没有数据附加到formData？其次，谁能说出我在哪里可以找到“ formData中的上载值，因为我找不到任何值？

我的浏览器是Firefox 73.0.1版

我的控制台输出：

Answer 1

您可以试试吗？>

<input type="file" type='file' id='file' name="file" class="image-upload" accept='image/*'/>


const uploadImg = () => {
let flag = 0;
let file = null;
const formData = new FormData();
if ($('.image-upload').val() != '') {
    file = $('#file')[0].files[0];
    flag = 1;
    formData.append('image', file);
    formData.append('flag', flag);
    $.ajax({
        type: 'POST',
        url: 'postStatus',
        data: formData,
        processData: false,
        contentType: false,
        success: function(res) {
            console.log(res);
        },
    });
}
};