javascript - 边框颜色更改仅适用于第一次

Question

我正在尝试制作一个基于 javascript 的小游戏。

这是游戏的小提琴

除了一些问题外，它几乎可以正常工作：-

1. 单击任意一个TD，如果图像在其中TD，则单元格边框颜色应为绿色，否则如果单击错误TD，则边框颜色变为红色。
   此功能仅在您第一次开始游戏时有效。从下次开始，它总是显示红色边框颜色。

2. 直到第8级，边框颜色的变化是可见的，但是随着级别的增加，用户无法体验他是否击中了正确的单元格。我想要这样的东西，一旦你点击了正确的单元格，颜色变化应该是可见且稳定的，直到图像出现在另一个单元格中。

代码和建议的任何改进都是可观的。

Answer 1

当您第二次开始游戏时，您调用startGame().

如果startGame()您有一个 $('td').click()，它将第二次触发，因此每次单击时，它都会实际单击两次（一次捕获，一次未命中）。

Answer 2

工作演示

这会成功的

在开始时取消绑定点击事件

$('td').unbind('click');

startGame()在函数上绑定点击事件

$('td').bind('click');

stopGame()解绑函数上的点击事件

$('td').unbind('click');

您的代码有问题：-

您正在startGame()函数中调用 click 事件，因此您第一次拥有一个$('td').click()函数

第二次你调用startGame()函数有两个$('td').click()函数，所以一个会造成混乱

第二点建议

演示

在函数callStart()中，您将下面的代码放在顶部，而不是将下面的代码放在 this 函数的末尾。

$('td').removeClass("insetBorderMiss");
$('td').removeClass("insetBorderCatch");