表单数据未填写

Question

FormData.

中有些地方我无法理解

这是我的代码：

<!DOCTYPE html>
<html>
<script src="bower_components/jquery/dist/jquery.min.js"></script>
</script>
<script>
$(function () {
    $('form').on('submit', function (e) {
          e.preventDefault();
          var form_data = new FormData($('form')[0]);
    });
});
</script>

<body>

<form>
<input name='a' value='vala'/>
<input name='b' value='valb'/>
<input name='c' value='valc'/>
<input type='submit' value='sub'/>
</form>

</body>
</html>

如果我在 Chrome 中调试我的代码，我希望 form_data 对象填充我的表单输入名称和值。

但它似乎总是空的。

我哪里错了？

Answer 1

您根本不需要遍历表单字段，因为您只需将 form 元素提供给 FormData() 构造函数即可。试试这个：

$('form').on('submit', function (e) {
      e.preventDefault();
      var form_data = new FormData($('form')[0]);
      // ajax here...
});

Answer 2

FormData 对象的行为与典型的 key => value 原则不同。它们最终会被添加并提交，而不是 accessed/modified.

Chrome 和 Firefox 似乎支持从 FormData 读取。看这里https://developer.mozilla.org/en-US/docs/Web/API/FormData/getAll

表单数据未填写

FormData not filled

html

jquery

form-data