Unexpected behaviour with Simon game

This is a link to my simon game on CodePen.

My program is commented well and is easy to follow. I am logging data to the console that helps to explain what the problem is.

The computer makes one turn. I follow. This works well. The computer makes another turn. I follow. I get a game over message. In the console, I can see that my second choice was correct. The problem is that the program accepted my second choice as my third choice too, which was incorrect. I can’t figure out why the program takes my second turn and uses that choice for my third turn too without allowing me to click a third time.

Like I mentioned, the console is logging data that is very helpful for describing this problem. The problem functions are computerTurn() and humanTurn().

If someone could take a look at this, I would appreciate it.


Every time u call function
u initialize new event click handler


just don’t leave it too much in working this jsfiddle snippet, can make huge memory stack…

Ok, i initialize a new event click handler every time I call humanTurn. When it’s the human’s turn, I have to listen for clicks. I don’t know where else to put the event click handler. I also don’t know why it is registering multiple clicks for one real click by the user. I don’t understand your jsfiddle? I see that it logs many clicks for one click. I don’t know why?

i don’t know what structure u want
but this advices may help u

u can create variables

var human = 1, computer = 2;
var onTurn = computer;

and then register just once this handler to check in body
if turn is on human something like:

 $(".fourButtons").click(function() {
     if ( onTurn !== human )

it will return control to caller if .fourButtons is clicked but human is not on turn
vice versa
u will write code for determing logic, does that clicked node is same as last element in squareChoices
only if this if statement is passed
and if it is u set somethig like
onTurn = computer;
and then call function for displaying computer move…

in general
u don’t need this function humanTurn, u just create this one event handler for human

fiddle explain:

i use setInterval to make every 1000ms brand-new click handler on this button, and clearInterval when it loop for 9 times to remove that behaivor, i add this restriction so there be no overflow in memory…

u will get ~9 event handlers for ~8 sec, just wait 8 seconds and then click on button

purpose is to see that with $.click function u can nest ur event handlers how much u ‘want’