Javascript 如果选中或不选中复选框，则返回addEventListener不是函数

您好，我得到了下面的代码片段，我试图打印

控制台。日志取决于是否选中了复选框

var checkbox = document.querySelectorAll('.customer-club-widget__gender__categories .form__input-checkbox');

checkbox.addEventListener("change", function() {

    var isChecked = checkbox.checked;
    if(isChecked){ //checked
        console.log('checked');
    }else{ //unchecked
        console.log('unchecked');
    }
});

我不断得到以下错误：

未捕获类型错误：
checkbox.addEventListener不是一个函数
，无法找出发生这种情况的原因

由于返回一个元素数组，并且您试图将事件附加到此数组，因此出现错误，否则您应该循环该数组，将更改事件附加到数组中的每个元素，如：

//Loop through the array elements and attach the event
for (var i = 0; i < checkbox.length; i++) {
  checkbox[i].addEventListener("change", checkedOrNot);
}

//Define separate function
function checkedOrNot() {
  var isChecked = this.checked;

  if (isChecked) { //checked
    console.log('checked');
  } else { //unchecked
    console.log('unchecked');
  }
}

//循环遍历数组元素并附加事件
对于（变量i=0；i

这有帮助


var checkbox=document.querySelectorAll（'.customer-club-widget\uuuuuu-gender\uuuu-categories.form\uuu-input-checkbox'）；
对于（变量i=0；i


A.


B


C


D
querySelectorAll
返回数组..querySelectorAll返回数组。您需要遍历数组并将侦听器添加到所有项中。或者只使用事件委派。
querySelectorAll
返回节点列表。如果要将侦听器添加到某个时间点中包含的节点列表的每个节点，可以使用
取决于是否有复选框
，如果是单个复选框，则不使用
All
版本，只需使用
querySelector（
）。