javascript - 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 是为了消除对单独点击事件的需要而添加的功能。