addEventListener 和传递 function 的问题

Question

My problem is that when I clicked one of this boxes function mark is call of 9 times. Why is this happening? I also add that boxes have 9 elements.

export function battle(app, mod, player) {

  const newHtml = html.replace("mode", mod.toUpperCase());

  app.innerHTML = newHtml;

  const boxes = document.querySelectorAll('.battle div');

  if (mod = 'single') {
    boxes.forEach(elem => addEventListener('click', (e) => {
      mark(e.target, player);
    }, false));
  }
  if (mod = 'multi') {

  }
}

Answer 1

You are calling addEventListener which is akin to window.addEventListener , so you are attaching 9 event handlers to the window object. A click anywhere will trigger all of them.

You need to add the event listener to the boxes.

elem => elem.addEventListener