通过Ajax提交表单 - FormData始终为空

Question

我需要使用ajax在服务器上上传照片。我也设置了JavaScript的形式，但FormData对象始终为空！我尝试过各种方式来引用实际的表单，但仍然无法正常工作。

小提琴例如： https://jsfiddle.net/cjngvg8a/

谢谢！

HTML：

<form id="profileImageForm" action="update.php" method="post" enctype="multipart/form-data"> 
<input type="text" value="hello" name="test" /> 
<input type="file" name="profile_pic" id="image_upload"/> 
<input type="submit" value="Save"/> 
</form> 

JS：

$('#profileImageForm').on('submit',(function(e) { 
    e.preventDefault();  
    var formData = new FormData(this); 

    console.log(formData); 

    $.ajax({ 
     type:'POST', 
     url: $(this).attr('action'), 
     data:formData, 
     cache:false, 
     contentType: false, 
     processData: false, 
     success:function(data){ 
      console.log("success"); 
      console.log(data); 
     } 
    }); 
})); 

Answer 1

在FORMDATA对象中的数据不被用console.log()检查它显露出来。它在那里，你看不到它。

如果您检查开发人员工具的Net标签，则可以看到表单内容正在上传。