nextLevel 函数不会在左侧最后一个子项上的单击事件时执行

Question

编辑:让我解释一下这个项目是什么。我必须创造一款玩家必须点击左侧面孔(游戏邦注:右侧面孔并不存在)的游戏;基本上是多余的脸。到目前为止，我可以让所有内容填充得很好，但是当我点击额外的脸时，nextLevel函数不会执行。

编辑:另外，请记住，generateFaces函数在HTML(未显示)中第一次执行onLoad。

函数，nextLevel，将不会执行当我点击额外的脸在左边(这将是leftside . lastchild)。它只是直接进入gameOver函数，如果你点击body上的任何地方，该函数应该执行。我的代码:

let numberOfFaces = 5;
const theLeftSide = document.querySelector('#leftSide');
const theRightSide = document.querySelector('#rightSide');
function generateFaces() {
for (let i = 0; i < numberOfFaces; i++) {
const face = document.createElement('img');
face.src = 'images/smile.png';
let randomTop = Math.floor(Math.random() * 400) + 1;
let randomLeft = Math.floor(Math.random() * 400) + 1;
face.style.top = randomTop + 'px';
face.style.left = randomLeft + 'px';
theLeftSide.appendChild(face);
}
const leftSideImages = theLeftSide.cloneNode(true);
leftSideImages.removeChild(leftSideImages.lastChild);
theRightSide.appendChild(leftSideImages);
theLeftSide.lastChild.addEventListener('click', nextLevel);
document.body.addEventListener('click', gameOver);
}
function nextLevel(event) {
event.stopPropagation();
numberOfFaces += 5;

generateFaces();
}
function gameOver() {
alert('Game Over!');
// theLeftSide.lastChild.removeEventListener('click', nextLevel);
// document.body.removeEventListener('click', gameOver);
}

我已经把整个代码和项目说明看了很多遍，但我似乎仍然不知道哪里出了问题。看来我已经正确地遵循了所有的指示。

事件监听器不在正确的位置?

任何帮助都会非常感激。谢谢。

Answer 1

我发现这是Chrome的一个问题。在包括Chrome Portable在内的其他浏览器中，一切都很好。可能是我在运行一个分机。我稍后会解决这个问题。但无论如何，看起来我的代码现在工作。感谢接电话的人。:)