Question

我使用这个小片段来获取表单值：

myForm = document.forms[1];
email = myForm.elements['email'];

但是，如果我打算在XHR 2的FormData中使用它，我必须这样做：

function sendForm() {
  var formData = new FormData();
  formData.append('email', email);

  var xhr = new XMLHttpRequest();
  xhr.open('POST', '/server', true);
  xhr.onload = function(e) { ... };

  xhr.send(formData);
}

有没有办法将所有表单数据作为一个javascript对象获取，我可以使用FormData？

Answer 1

只需将表单对象设置为FormData参数：

function sendForm() {
  var myForm = document.forms[1];
  var formData = new FormData(myForm);

  var xhr = new XMLHttpRequest();
  xhr.open('POST', '/server', true);
  xhr.onload = function(e) { ... };
  xhr.send(formData);
}

注意：它也适用于input type="file"

Answer 2

您可以做的是，将所有信息存储在数组中并动态附加它们。

var myForm = document.forms[1];
var data = {};
data["email"] = myForm.elements["email"];
data["username"] = myForm.elements["username"];
data["password"] = myForm.elements["password"];
//  ... and so on...

现在在您的发送中，您可以将数据作为参数传递并附加所有数据：

function sendForm(data) {
  var formData = new FormData();

  for(var i in data) {
    formData.append(i,data[i]);
  }

  var xhr = new XMLHttpRequest();
  xhr.open('POST', '/server', true);
  xhr.onload = function(e) { ... };

  xhr.send(formData);
}

Javascript：获取所有表单键和值，并将它们组合为javascript对象以与XHR 2 FormData一起使用

2 个答案: