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

Question

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

这是游戏的Fiddle

除了几个问题外，它几乎可以工作：-

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()函数中调用点击事件，因此您第一次有了一个$('td').click()函数

第二次调用startGame()函数时，有两个$('td').click()函数，还有一个创建了混乱的

第二点的建议

演示

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

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