從form.elements數組javascript中刪除按鈕輸入

Question

我有一個表單，並且要抓取其中的所有輸入元素，並將它們放入它們的鍵中，並將值放入對象中（這是可行的）...但是我不想過濾掉不需要的按鈕...如何刪除/忽略它？

如果我console.log form.elements它返回：

[input#first_name.input-text, input#last_name.input-text, input#username.input-text, input#email.input-text, 
button#submit.btn ...]

  const formatData = {};
  const form = document.getElementById('signup');
  console.log(form.elements);

  for (let i = 1; i < myForm.elements.length; i++) {
      // check if button and remove / ignore
      if (form[i] === 'button') { // this doesn't work
          delete form[i];
      }
      const key = form.elements[i].name;
      const value = form.elements[i].value;
      formatData[key] = value;

如何確定不包含按鈕？ ：\\（這是用jsx語法編寫的）

Answer 1

您可以通過tagName過濾form.elements 。

const formatData = {};
const form = document.getElementById('signup');

[].slice.apply( form.elements ) // convert HTMLFormControlsCollection to Array
  .filter(( el ) => el.tagName !== 'BUTTON') // filter out all <button> elements
  .forEach(function ( el ) {
      formatData[ el.name ] = el.value; // add key / value to formatData object
  });

或者，如果您更喜歡for循環：

const formatData = {};
const form = document.getElementById('signup');

for (let i = 0, n = form.elements.length; i < n; i++) {
  if (form.elements[i].tagName === 'BUTTON') continue;

  formatData[ form.elements[i].name ] = form.elements[i].value;
}

Answer 2

 for (let i = 1; i < myForm.elements.length; i++) {
      if (form[i].type !== 'button') { // or as suggested form[i].tagName !== 'BUTTON'
          const key = form.elements[i].name;
          const value = form.elements[i].value;
          formatData[key] = value;
      }

您是否不想遍歷所有元素並以0開頭i？

Answer 3

var
    elementCollection = document.forms[document.forms.length -1].elements,
    elementRegistry   = Array.from(

        elementCollection

    ).reduce(function (collector, elm) {
        if (
               (elm.tagName.toLowerCase() !== 'button')
            && !collector.regXIgnoreTypes.test(elm.type)
        ) {
          //var key = (elm.id || elm.name);
            var key = elm.name;
            if (key !== '') {

                collector.elementRegistry[key] = elm;
            }
        }
        return collector;
    }, {

      regXIgnoreTypes: (/^(?:button|submit|image|hidden)$/),
      elementRegistry: {}

    }).elementRegistry;

console.log('+++ elementRegistry +++', elementRegistry);