How to reattach event handlers

[chibineku]

The topic title isn't accurate, but its hard to describe in one line.I am writing a simple tic-tac-toe script. At the moment, when you start, the grid is empty. When you enter an x or an o and hit the 'go' button (or anywhere else, but not the next input field), a jQuery attached blur handler fires.First, the input is validated - did the user type anything, is this the first time (so i can set the player's counter, x or o), etc.Then, another function gathers all the grid data in a multidimensional array and passes this to the move() function.At the moment, I just want to enter a character in the next free square. This works the first time, but on subsequent turns, only the validate part of the script seems to run - move() doesn't.Here is the entire script, and a link:

$(document).ready(function() {   //setup   $('#tic_tac_toe_frame tr td').html('<input type="text" value="" size="1" maxlength="1" ></input>');   $('#tic_tac_toe_frame tr td input').each( function() {	 $(this).blur(function() {	  validate(this);	 });   });   $('#tic_tac_toe_frame tr')[1].style.borderBottom = "2px solid black";   $('#tic_tac_toe_frame tr')[2].style.borderBottom = "2px solid black";   $('#tic_tac_toe_frame tr td:eq(0)').css("border-right", "2px solid black");   $('#tic_tac_toe_frame tr td:eq(1)').css("border-right", "2px solid black");      var player = '';   var comp = '';   function validate(el) {	 if($(el).val() == '') {	 } else if($(el).val() != 'x' && $(el).val() != 'o') {	   alert("Only type 'o' or 'x' please!");	   $(el).val('');	 } else if($(el).val() == 'x' || $(el).val() == 'o') {	   if (player == '') {		player = $(el).val();		gather(el);	   } else if(player != '') {		if($(el).val() != player) {		 alert("You're playing "+player+"!");		 $(el).val('');		}	   } else if($(el).val() == player) {		gather(el);	   }	 }	   }	   function gather(el) {	 //gather all the numbers already input	 var rows = new Array();	 //for each row	 $('#tic_tac_toe_frame tr').not('.ignore').each(function(r) {	   rows[r+1] = new Array();	   //for each column in each row	   $(this).find('td input').each(function(c) {		 rows[r+1][c+1] = $(this).val();	   });	 });	 move(rows);	 }	 function move(rows) {	   comp = (player == 'x')?'o':'x';	   for(var i in rows) { //for each row		 for(var j in rows[i]) { //for each col		  if(rows[i][j] != player && rows[i][j] != comp) {			$("#tic_tac_toe_frame tr:eq("+i+") td:eq("+(j-1)+") input").val(comp);			return true;		  }		 }	   }	 }});

I have tried adding the blur handler setter at the end of move() but that didn't do anything. I know validate() runs because if you enter an illegal character you get the proper response. Any ideas?

[justsomeguy]

If the move function gets executed through the validate function, and the validate function is getting executed, but not move, then either the data is not correct to allow move to run (i.e., an if statement fails that you expected to succeed), or there is an error happening.

[chibineku]

Well, it's got me stumped for now anyway. I have alerted all over the place and everything seems to be running smoothly, but after the initial time through, move() just doesn't seem to do anything.