Question

var f = '\
  <form id="myForm" name="myForm">\
    <div>\
      <label for="username">Enter name:</label>\
      <input type="text" id="username" name="username">\
    </div>\
    <div>\
      <label for="useracc">Enter account number:</label>\
      <input type="text" id="useracc" name="useracc">\
    </div>\
    <div>\
      <label for="userfile">Upload file:</label>\
      <input type="file" id="userfile" name="userfile">\
    </div>\
    <input type="submit" value="Submit!">\
  </form>\
';
document.write(f);

var test = document.getElementById('myForm');
console.log(test);
var form_data = new FormData(test);

我尝试使用FormData从所有字段中收集所有数据。为什么，为什么它不起作用？ Formdata是空的......

Answer 1

你可以使用jQuery方法.serializeArray()，这很简单，例如：

$('form').serializeArray();

这样您就可以收集除文件之外的所有输入值。要获取文件，您可以使用$('#userfile').prop('files');。

之类的内容

以下是工作片段：

＆＃13;

var f = '\
  <form id="myForm" name="myForm">\
    <div>\
      <label for="username">Enter name:</label>\
      <input type="text" id="username" name="username">\
    </div>\
    <div>\
      <label for="useracc">Enter account number:</label>\
      <input type="text" id="useracc" name="useracc">\
    </div>\
    <div>\
      <label for="userfile">Upload file:</label>\
      <input type="file" id="userfile" name="userfile">\
    </div>\
  <input type="button" id="submit" value="Submit!" onclick="collectData()">\
</form>\
';

document.write(f);

function collectData() {
  var form_data = $('#myForm').serializeArray();
  var file = $('#userfile').prop('files');
  form_data.push(file);
  console.log(form_data);
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

FormData jquery不起作用

1 个答案: