边框颜色变化仅适用于第一次

Question

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

以下是Fiddle for the GAME

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

  

  

1. 点击任意TD，如果图片位于TD，则单元格边框颜色应为绿色，否则   如果您点击错误的TD，边框颜色会变为红色   此功能仅在您第一次开始游戏时起作用。从下次总是这样   显示红色边框颜色。

  

2. 直到等级8，边框颜色的变化是可见的，但随着您增加级别，用户   无法体验他是否已经击中了正确的细胞。我想要一样，只要你碰到正确的细胞，颜色变化应该是可见的和稳定的，直到图像出现在另一个细胞中。

  

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

Answer 1

当您第二次开始游戏时，请拨打startGame()。

在startGame()中你有一个$('td').click()，它会第二次触发，所以在每次点击时，它会实际点击两次（一次捕获，一次遗漏）。

Answer 2

Working DEMO

这样就可以了解

在开始

中取消绑定点击事件

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

在startGame()函数

上绑定click事件

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

取消绑定stopGame()功能

上的点击事件

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

您的代码出现问题： -

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

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

建议第二点

DEMO

在功能callStart()中，您已将下方置于顶部，而是将以下代码放在此功能的末尾。

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