Javascript 禁用按钮，直到填写所有字段

Question

将不胜感激一些帮助解决这个问题。需要使事件监听器适用于所有元素。所以基本上，当您填写姓名、姓氏，即所有字段时，只有按钮应该被启用，即使其中一个字段为空，按钮也应该被禁用。

 (function () {
 "use strict";

 var knapp = document.getElementById('skicka');

 knapp.disabled = true;

 var f=document.getElementById('fornamn');
 var e=document.getElementById('efternamn');
 var p=document.getElementById('passnr');
 var n=document.getElementById('nat');

 e.addEventListener('change',function(){

  if(e.value==='' ){

 knapp.disabled=true;
   }

 else{
  knapp.disabled=false;
 }
  });

  })();

Answer 1

let d = document, [inputs, knapp] = [
    d.querySelectorAll('[type="text"]'),
    d.querySelector('#skicka')]
knapp.disabled = true

for (i = 0; i < inputs.length; i++) {
  inputs[i].addEventListener('input',() => {
    let values = []
    inputs.forEach(v => values.push(v.value))
    knapp.disabled = values.includes('')
  })
}

<form>
  <input id=fornamn type=text><br>
  <input id=efternamn type=text><br>
  <input id=passnr type=text><br>
  <input id=nat type=text><br>
  <input type=button id=skicka value=Complete>
</form>

这样就可以了。我更喜欢 input 上的事件处理程序，而不是 change，这样您就可以在键入时看到启用的按钮。每次在任何字段中输入任何内容时，它都会立即获取所有值并将它们添加到数组中。 .includes() 是 ES6 中的新方法，它是一种检查数组的特定值并返回 bool 值的方法。