FormData 缺少提交的值 - 得到它，也许没有 SubmitEvent.submitter？

Question

当我收听 <form> 的 submit 事件并获取表单的 FormData 时，例如通过 XHR 提交，提交按钮的数据丢失：

<form>
  <input type="text" name="x" value="foo" />
  <input type="hidden" name="y" value="bar" />
  <button type="submit" name="submit1" value="bar">submit1</button>
  <input type="submit" name="submit2" value="submit2" />
</form>

FormData 将有 x 和 y，但既没有 submit1 也没有 submit2。 Try it in a Pen。 ~~它应该~~我希望它包含其中之一，即触发提交的那个——就像将要发送到的数据一样action.

我可以做点什么onsubmit，比如

form.onsubmit = function (evt) {
  var fd = new FormData(form);
  fd.append(evt.submitter.name, evt.submitter.value);
  // process fd...
});

但是 SubmitEvent.submitter 相当新，特别是没有 IE，在撰写本文时只有 Safari 的 TP。

有没有办法在不采取变通方法的情况下将提交提交到 FormData 中，例如监听 所有表单输入的点击事件 并使用其数据创建隐藏输入？

接受答案后，我确实实现了一个“polyfill”：

document.querySelectorAll('form').forEach(function (form) {
  // query might miss <button>s without @type
  form.querySelectorAll('[type="submit"]').forEach(function (submit) {
    submit.addEventListener('click', function () {
      var input = document.createElement('input')
      input.setAttribute('type', 'hidden')
      input.setAttribute('name', this.name)
      input.setAttribute('value', this.value)
      this.form.appendChild(input)
    })
  })
})

Answer 1

Is there a way to get the submit into FormData without doing a workaround like listening to all the form's inputs' click events and creating, say, hidden inputs with their data?

没有

SubmitEvent.submitter 是为了消除对单独点击事件的需要而添加的功能。

FormData 缺少提交的值 - 得到它，也许没有 SubmitEvent.submitter？

FormData is missing submit's value - get it, maybe without SubmitEvent.submitter?

html

javascript

forms

form-data