Javascript 表单的多个附件
我有一个表格,我必须添加多个附件。这个功能应该是动态的,就像用户可以选择任意多个文件并取消其中任何一个文件一样 在前端,我创建了一个文件输入元素,在它的“onchange”中,我添加了另一个具有不同id和相同名称的文件输入元素。我使用的名称是“附件[]”,因为我需要将附件作为数组发送 Submit按钮调用javascript函数,其中我使用jquery获取参数并创建formdata。函数片段是Javascript 表单的多个附件,javascript,jquery,forms,file-upload,Javascript,Jquery,Forms,File Upload,我有一个表格,我必须添加多个附件。这个功能应该是动态的,就像用户可以选择任意多个文件并取消其中任何一个文件一样 在前端,我创建了一个文件输入元素,在它的“onchange”中,我添加了另一个具有不同id和相同名称的文件输入元素。我使用的名称是“附件[]”,因为我需要将附件作为数组发送 Submit按钮调用javascript函数,其中我使用jquery获取参数并创建formdata。函数片段是 function send() { var form = document.getElementByI
function send()
{
var form = document.getElementById("composeForm");
var formElements = form.elements;
var formdata;
for (x in formElements)
{
//each element that has type='file' and value is 0 is what we want to delete later
if(formElements[x].type=='file'&&formElements[x].value.length!=0)
{
console.log(document.getElementById(formElements[x].id).files[0]);
formdata = new FormData();
var file = document.getElementById(formElements[x].id).files[0];
formdata.append("attachment[]", file);
}
}
if (!formdata)
{
formdata = new FormData();
}
formdata.append("subject", document.getElementById("subjectInput").value);
if (formdata) {
$.ajax({
url: "../ws/attach.php",
type: "POST",
data: formdata,
processData: false,
contentType: false,
success: function (res) {
alert(res);
}
});
}
return false;
}
但问题是它总是发送参数中最后添加的文件。上面包括显示所有文件的console.log,即
File {webkitRelativePath: "", lastModifiedDate: Thu Dec 06 2012 03:01:55 GMT+0530 (India Standard Time), name: "backup.txt", type: "text/plain", size: 10584}
File {webkitRelativePath: "", lastModifiedDate: Wed Dec 19 2012 16:24:36 GMT+0530 (India Standard Time), name: "acknowledgement.pdf", type: "application/pdf", size: 163435}
但是chrome inspect元素显示发送的唯一参数是 ------WebKitFormBoundaryVYMwpCkBb8zK6tg0
Content-Disposition: form-data; name="attachment[]"; filename="acknowledgement.pdf"
Content-Type: application/pdf
我少了什么吗?我犯了一个愚蠢的错误。错误是由于每次初始化FormData时:(
无论如何,感谢他们花时间在这上面。您应该使用
var x
。无需将x
设置为全局!
formdata = new FormData();