使用jQuery AJAX和FormData进行文件上传
我试图通过JQuerys AJAX方法和FormData方法将表单中的文件上传到PHP服务器。
按下上传按钮后,我使用knockoutJS触发提交操作。
HTML表单:
<form class="form-horizontal" method="post" enctype="multipart/form-data" data-bind="submit: addNewFile">
<fieldset>
<legend>Add File</legend>
<div class="form-group">
<label for="inputFile" class="col-lg-2 control-label">File</label>
<input type="file" id="inputFile" name="inputFile">
</div>
<div class="form-group">
<button class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-primary">Save</button>
</div>
</fieldset>
</form>
触发的javascript代码:
self.addNewFile = function (content){
var formData = new FormData(content[1].files[0]);
$.ajax({
url: '../api/addFile',
type: 'POST',
data: formData,
contenType: false,
processData: false})
}
formData变量如下所示:http://i.stack.imgur.com/jZ06z.png
http请求看起来像这样:http://i.stack.imgur.com/0Whfe.png
没有文件传输到服务器。 内容类型设置为application / x-www-form-urlencoded,但它应该是multipart / form-data。 我究竟做错了什么?
FormData构造函数接受一个HTMLFormElement(即一个不是文件的表单)来添加一个单独的文件,您必须使用append
方法
var formData = new FormData();
formData.append('file',content[1].files[0]);
你也contenType
它应该是contentType
,注意到2 Ts在一起