1

我有一个带有multipart/form-dataenctype 的表单,类似于以下 HTML 代码:

<form id="myform" action="/parse" method="post" enctype="multipart/form-data">
Name: <input type="text" name="name" id="name" placeholder="Enter your name">
Age: <input type="number" name="age" id="age" placeholder="Enter your age">
Photo: <input type="file" name="image" id="image">
<input type="submit">
</form>
<div id="preview"></div>

现在我可以用这个 jQuery 代码显示预览图像:

$('#image').change(function() {
    var file = $(this).get(0).files[0];
    //var preview = $('#preview');
    var img = document.createElement('img');
    img.src = window.URL.createObjectURL(file);
    $('#preview').html(img);
    var reader = new FileReader();
    reader.onload = function(e) {
        window.URL.revokeObjectURL(this.src);
    }
    reader.readAsDataURL(file);
    $('#preview img').css({'width':'200px'});
});

...我有这个 FormData() 对象:

var data = new FormData();
data.append('name', $('#name').val());
data.append('age', $('#age').val());

如何将图像的数据添加到 FormData() 对象?

谢谢!

4

1 回答 1

1

这将自动将表单的所有字段添加到 FormData 对象,包括文件输入。

var data = new FormData($('#myform')[0]);

你不需要使用

data.append('name', $('#name').val());
data.append('age', $('#age').val());
于 2013-07-06T17:40:18.360 回答