javascript - 通过ajax提交表单

Question

我有这个表格：

<form id="ugaForm" method="POST" action="/url/upload" target="myFrame"
enctype="multipart/form-data">

Please select a file to upload : <input id="file" type="file" name="file" />
<input type="button" onclick="submitF()" value="upload" />
</form>             

正常提交时，它工作得很好。

我需要一个ajax帖子来模仿这个确切的表单提交。此代码不起作用：

function submitF() {
debugger;
var mfile = $("form#ugaForm")[0].file;
var fd = new FormData();    
fd.append( 'file', mfile);

$.ajax({
  url: 'http://localhost/url/upload/',
  data: JSON.stringify({ 'objectData' : fd}),
  cache: false,
  contentType : false,      
    processData: false,
    type: 'POST',
    success: function(data){
        alert(data);
    }
});

Answer 1

如果您通过 AJAX 提交某些内容，那么为什么要将其放入表单中。只需删除表格并保留其中的其他内容，以便它变成这样：

<div id="ugaForm">
    Please select a file to upload : <input id="file" type="file" name="file" />
    <input type="button" onclick="submit()" value="upload" />
</div>

JS 是这样的：

function submitF() {
    debugger;
    var mfile = $("#ugaForm")[0].file;
    var fd = new FormData();
    fd.append('file', mfile);

    $.ajax({
        url: 'http://localhost/url/upload/',
        data: JSON.stringify({
            'objectData': fd
        }),
        cache: false,
        contentType: false,
        processData: false,
        type: 'POST',
        success: function (data) {
            alert(data);
        }
    });
}

希望能帮助到你。