html formdata 未定义,jQuery：FormData()不起作用

我做了一个非常简单的示例来测试jQuery的FormData是否起作用。

html

然后导入jQuery CDN：

我从计算机上选择了一些图像文件。

并在Chrome development tool中执行以下代码：

>> var form = $('#frm');

>> form

>> var formData = new FormData(form);

>> formData

它表明，

FormData {}

它不包含任何值。 它是空的。 为什么不起作用？

formData是纯JavaScript，而不是jQuery。 因此，正如Safarov先生建议的那样，在jQuery对象的末尾放置[0]会将其取消引用到将被识别的普通JavaScript对象中。

我认为您需要调用FormData.append方法将文件添加到FormData对象。

这是我用ajax向服务器提交FormData对象的示例代码。

Upload

var fileSelect = document.getElementById('file-select');

$(document).ready(function () {

//Listen the upload button onclick

$('#btn-upload').on("click",function(){

event.preventDefault();

//Check if contains files to upload

if(fileSelect.files.length != 0){

//Declare a FormData Object to pass the files

var formData = new FormData();

var fileCount = fileSelect.files.length;

//Add the files from file-select into FormData

for (var i = 0; i < fileCount; i++)

{

var file = fileSelect.files[i];

formData.append("FileUpload", file);

}

//Make the ajax post request with FormData to your destination(eg:webservice or php page)

$.ajax({

type: 'POST',

url: 'http://yourhost:port/something.php',

data: formData,

contentType:false,

processData: false,

success: function (data) {

//Do the next process u want

},

error: function(err){

//Process the error

}

});

}

});

});

希望这对您的FormData用法有用。

我认为，您应该尝试传递元素本身，而不是jQuery对象：

var formData = new FormData(form[0]);

form也是这里(var form = $(#frm);)中的jQuery对象。 如何在不使用jquery的情况下选择表单元素？ 我做了var form = $(form)和new FormData(form)，结果是一样的

您已经正确选择了表单对象。 现在，您只需要从jQuery对象中获取DOM元素本身，您要做的就是：form[0]

哇。 有用。 非常感谢