Question

我正在尝试测试一个简单的FormData对象，但它根本不起作用。 jsfiddle：https://jsfiddle.net/8j80898h/

html代码：

<form id="createForm" name="createForm" novalidate enctype="multipart/form-data">
    <input type="hidden" name="name" value="Name1" />
    <input type="file" name="file" />
    <input type="button" id="submitIt" value="Submit" />
</form>

JS：

$(document).ready(function() {
    $('#submitIt').click(function() {
        var fd =  new FormData($('#createForm')[0]);
        fd.append( 'name', $('input[name=name]').val());

        $.ajax({
            url: url,
            data: fd,
            processData: false,
            contentType: false,
            type: 'POST',
            success: function(data){                    
                alert(data);
            }
        });
    });
});

服务器始终为名称和文件

获取空值

Answer 1

FormData有一个get方法你应该使用：

$(document).ready(function() {
    $('#submitIt').click(function() {
        var d = new FormData($('form')[0]);        
        alert(d.get('name'));
    });
});

在MDN中阅读更多内容：https://developer.mozilla.org/en-US/docs/Web/API/FormData/get

Answer 2

而不是制作FormData对象，您可以访问表单中的元素，如下面的代码所示:)

$(document).ready(function() {
  $('#submitIt').click(function() {
    var d = $('form').toArray();        
    alert(d[0].name);
  });
});

简单的FormData无法正常工作

2 个答案: