主页 / 问题 / 1099875
Accepted
E_K
Asked:2020-03-26 05:51:53 +0000 UTC2020-03-26 05:51:53 +0000 UTC

为什么会出现“无法读取未定义的属性'forEach'”错误？

  • 772

为什么会出现错误

无法读取未定义的属性“forEach”

当作业在一个init.

this.inputs = document.querySelectorAll('[form="deleteMany"]')

但是，如果您将分配转移到该方法，则selectAll一切正常。

window.addEventListener('load', function() {
  var selector = {
    input: null,
    inputs: null,
    selected: false,
    init(elemId) {
      this.input = elemId ? elemId : "js-select-all";
      this.inputs = document.querySelectorAll('[form="deleteMany"]');
      this.addEvent();
    },
    addEvent() {
      document.getElementById(this.input).addEventListener('change', this.selectAll);
    },
    selectAll() {
      if (!this.selected) {
        this.inputs.forEach(e => e.checked = true);
        this.selected = true;
        return;
      }

      this.inputs.forEach(e => e.checked = false);
      this.selected = false;
    }
  };

  selector.init('js-select-all');
  console.log(selector.inputs);
});
<table>
  <thead>
    <tr>
      <td><input id="js-select-all" type="checkbox"></td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><input form="deleteMany" type="checkbox"></td>
    </tr>
    <tr>
      <td><input form="deleteMany" type="checkbox"></td>
    </tr>
    <tr>
      <td><input form="deleteMany" type="checkbox"></td>
    </tr>
  </tbody>
</table>

javascript

1 个回答

  1. Best Answer

    因为它selectAll不是在对象的上下文中调用的selector，而是在该函数作为事件处理程序附加到的 DOM 元素的上下文中调用的'change'。

    addEvent() {
  document.getElementById(this.input).
    addEventListener('change', this.selectAll.bind(this));
},
    • 3

相关问题