Question

使用Ajax，可以使用以下内容作为ajax-

的数据发送表单的部分数据

$("#CreateForm").find("#form-section-1").find('input, textarea, select').serialize()

尝试使用FormData api -

new FormData($('form#CreateForm')[0])

但这不起作用 -

var formdata = new FormData($('form#CreateForm').find("#form-section-1").find('input, textarea, select'))

由于下面的循环没有结果 -

for (var pair of formdata.entries()) {
    console.log(pair[0]+ ', ' + pair[1]); 
}

如何使用Formize api以紧凑的形式提交部分表单数据，如serialize？

修改在Accepted solution中，我不得不进一步为文件添加这个条件 -

if($(this).is(':input:file')) { 
formData.append(this.name, $(this)[0].files[0]); 
} else { 
formData.append(this.name, $(this).val()); 
}

Answer 1

FormData constructor接受可选的原生<form/>元素参数来传递表单中的所有数据。通知，

$('form#CreateForm') // jQuery object
$('form#CreateForm')[0] // native form element
$('form#CreateForm #form-section-1').find('input, textarea, select') // jQuery objects
$('form#CreateForm #form-section-1').find('input, textarea, select')[0] // some native non-form element

所以你无法真正使用构造函数。

FormData对象确实有一个.append method来向对象添加新值。你可以用它来做

var formData = new FormData();
$('form#CreateForm #form-section-1').find('input, textarea, select').each(function () {
        if($(this).is(':input:file')) {
            formData.append(this.name, $(this)[0].files[0]);
        } else {
            formData.append(this.name, $(this).val());
        }
});

仅供参考:input是input|select|textarea|button的简写。

使用FormData api提交部分表单数据

1 个答案: