重置嵌套 if 语句中的"this.id"

Question

我有这个功能来控制记忆游戏。 用户被大量的图像呈现，几秒钟后图像消失，然后用户必须按预先确定的顺序单击图像。

例如，用户首先需要单击代表足球的图像，然后单击树等。如果用户在游戏结束时失败

。现在的问题是我无法访问第二个嵌套的 if 语句。 This.id 粘在单击的第一个图像上，有没有办法重置 this.id 以便用户可以单击第二个图像？还是其他解决方案？

function flagsAddEventlistener() {
if (this.id == correctOrderArray[0]) {
points += 1;
userMessageElement.innerHTML = "Correct answer";
this.src = `flags/${correctOrderArray[0]}.png`;
if (this.id == correctOrderArray[1]) {
points += 1;
userMessageElement.innerHTML = "Correct answer";
this.src = `flags/${correctOrderArray[1]}.png`;
}
} else {
userMessageElement.innerHTML = "Faulty answer";
}
}

Answer 1

由于您需要知道用户单击图像的次数，因此您需要添加一个状态(在侦听器外部定义的变量(。

下面是一个简单的示例：

let counter = 0;
function flagsAddEventlistener() {
if (this.id == correctOrderArray[counter]) {
points++;
userMessageElement.innerHTML = "Correct answer";
this.src = `flags/${correctOrderArray[counter]}.png`;
} else {
userMessageElement.innerHTML = "Faulty answer";
}
counter++;
}