Two Player Tic Tac Toe Game in Javascript -


i wanted make own tic tac toe game, new javascript , has been 2 days, , unable reach concrete... far.. have achieved in game- http://jsfiddle.net/f9sv4/

//tic tac toe //global variables //get input user sign should playerone. //set signs both players. //when user click on button triggers play function() //play function detects playing turn. //display sign on button accordingly. var playeronechoice; var playertwochoice; var playerturn=1; var matrix = [[], [], []]; var buttons = [[], [], []]; var row1; var x = "x"; var o = "o"; var x; var y; var i;  //input matrix (i = 0; <= 8; i++) {     switch (i) {     case 0: x=0; y=0; break;     case 1: x=0; y=1; break;     case 2: x=0; y=2; break;     case 3: x=1; y=0; break;     case 4: x=1; y=1; break;     case 5: x=1; y=2; break;     case 6: x=2; y=0; break;     case 7: x=2; y=1; break;     case 8: x=2; y=2; break;     }     matrix[x][y] = document.queryselector(".cell"+i);     buttons[x][y] = document.queryselector("#b"+i);     //matrix[x][y].innerhtml = + " " + x + " " + y; } function play() { displayoutput();  incplayerturn(); } function displayturn() {     var display = document.queryselector("#playerturn");     if (playerturn%2==0)         display.innerhtml ="its player 2 turn";     else         display.innerhtml ="its player 1 turn"; }     function incplayerturn(){     playerturn++; } function displayoutput(){     if (playerturn%2 == 1)         this.innerhtml = playeronechoice;     else         this.innerhtml = playertwochoice; } function seto(){     playeronechoice="o";     playertwochoice="x" } function setx(){     playeronechoice="x";     playertwochoice="o" }  function displayo(){ var butt = document.getelementsbytagname("button"); var buttonscount = buttons.length; (var = 0; <= buttonscount; += 1) {  butt[i].onclick = function(e) {  this.innerhtml ="o";     }; } }  function displayx(){ var butt = document.getelementsbytagname("button"); var buttonscount = buttons.length; (var = 0; <= buttonscount; += 1) {     butt[i].onclick = function(e) {  this.innerhtml ="x";     }; } } 

now, not sure, how can know button clicked, , how can set "o" or "x" per user choice.

i thought simple game design looks has got complicated.

how can know button clicked

inside function assigned onclick property of button, 'this' represents button clicked.

how can set "o" or "x" per user choice.

buttons have value property, changes button's text, e.g:

this.value = "x" 

you have user choice somehow, store it, read inside onclick function. or, make button changes between 'x' , 'o' every time clicked.

this.value = (this.value == "x") ? "o" : "x" 

Comments

Popular posts from this blog

c# - DetailsView in ASP.Net - How to add another column on the side/add a control in each row? -

javascript - firefox memory leak -

Trying to import CSV file to a SQL Server database using asp.net and c# - can't find what I'm missing -