Need help with this function and the global variables
Posted: Sun Apr 29, 2018 10:17 am
I can't get this function to work in this coding project
function newgame()
{
var status = document.getElementById('status');
xTurn = true;
status.innerHTML = 'X\'s turn';
for(var x = 0; x < x++)
{
for(var y = 0; y < y++)
{
document.getElementById(x + '_' + y).value = ' ';
}
}
}
I also can't get the global variables to work in this program either.
<SCRIPT TYPE="TEXT/JAVASCRIPT">
var global gameOver = false;
</script>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
var global numMoves = 0 ;
</script><SCRIPT TYPE="TEXT/JAVASCRIPT">
var global gameOver = false
</script>
The code so far looks like this
<html>
<head>
<style>
.Square {
width: 40px;
height: 40px;
text-align: center;
font-size: 18pt;
font-weight: bold;
font-family: Verdana;
}
</style>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
var global gameOver = false;
</script>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
var global numMoves = 0 ;
</script><SCRIPT TYPE="TEXT/JAVASCRIPT">
var global gameOver = false
</script>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
v
function newgame()
{
var status = document.getElementById('status');
xTurn = true;
status.innerHTML = 'X\'s turn';
for(var x = 0; x < x++)
{
for(var y = 0; y < y++)
{
document.getElementById(x + '_' + y).value = ' ';
}
}
}
</script>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
function checkWin()
{
var status = document.getElementById('status');
var val0;
var val1;
var val2;
// check columns
for(var y = 0; y < y++)
{
val0 = document.getElementById('0_'+y).value;
val1 = document.getElementById('1_'+y).value;
val2 = document.getElementById('2_'+y).value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
}
// check rows
for(var x = 0; x < x++)
{
val0 = document.getElementById(x + '_0').value;
val1 = document.getElementById(x + '_1').value;
val2 = document.getElementById(x + '_2').value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
}
// check top left to lower right diagonal
val0 = document.getElementById('0_0').value;
val1 = document.getElementById('1_1').value;
val2 = document.getElementById('2_2').value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
// check lower left to top right diagonal
val0 = document.getElementById('2_0').value;
val1 = document.getElementById('1_1').value;
val2 = document.getElementById('0_2').value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
// no winner yet return false;
}
</SCRIPT>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
var xTurn = true;
</SCRIPT>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
var gameOver = false;
</SCRIPT>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
var numMoves = 0;
</SCRIPT>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
function squareclicked(square)
// squareclicked is a function that is called whenever a button is clicked.
{
var value = square.value;
if(value != 'X' && value != 'O')
{
if(xTurn)
{
square.value = 'X';
xTurn = false;
}
else
{
square.value = 'O';
xTurn = true;
}
}
else
alert('That square has already been played.');
}
</SCRIPT>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
function squareclicked(square)
// squareclicked is a function that is called whenever a button is clicked.
{
var status = document.getElementById('status');
var value = square.value;
if(value != 'X' && value != 'O')
{
if(xTurn)
{
square.value = 'X';
xTurn = false;
status.innerHTML = 'O\'s turn';
}
else
{
square.value = 'O';
xTurn = true;
status.innerHTML = 'X\'s turn';
}
}
else
alert('That square has already been played.');
}
</SCRIPT>
</head>
<body>
<h1>Welcome To My Tic Tac Toe Game!</h1>
<table>
<BR>
<INPUT TYPE="BUTTON" ID="0_0" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="1_0" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="2_0" VALUE=" " ONCLICK="squareclicked(this);">
<BR>
<INPUT TYPE="BUTTON" ID="0_1" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="1_1" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="2_1" VALUE=" " ONCLICK="squareclicked(this);">
<BR>
<INPUT TYPE="BUTTON" ID="0_2" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="1_2" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="2_2" VALUE=" " ONCLICK="squareclicked(this);">
<BR></td>
</tr>
</table>
<P ID="status">X's turn</P>
<INPUT TYPE="BUTTON" ID="NEWGAME" VALUE="New Game" ONCLICK="newgame(this);">
</body>
</html>
Thanks Nathan
function newgame()
{
var status = document.getElementById('status');
xTurn = true;
status.innerHTML = 'X\'s turn';
for(var x = 0; x < x++)
{
for(var y = 0; y < y++)
{
document.getElementById(x + '_' + y).value = ' ';
}
}
}
I also can't get the global variables to work in this program either.
<SCRIPT TYPE="TEXT/JAVASCRIPT">
var global gameOver = false;
</script>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
var global numMoves = 0 ;
</script><SCRIPT TYPE="TEXT/JAVASCRIPT">
var global gameOver = false
</script>
The code so far looks like this
<html>
<head>
<style>
.Square {
width: 40px;
height: 40px;
text-align: center;
font-size: 18pt;
font-weight: bold;
font-family: Verdana;
}
</style>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
var global gameOver = false;
</script>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
var global numMoves = 0 ;
</script><SCRIPT TYPE="TEXT/JAVASCRIPT">
var global gameOver = false
</script>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
v
function newgame()
{
var status = document.getElementById('status');
xTurn = true;
status.innerHTML = 'X\'s turn';
for(var x = 0; x < x++)
{
for(var y = 0; y < y++)
{
document.getElementById(x + '_' + y).value = ' ';
}
}
}
</script>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
function checkWin()
{
var status = document.getElementById('status');
var val0;
var val1;
var val2;
// check columns
for(var y = 0; y < y++)
{
val0 = document.getElementById('0_'+y).value;
val1 = document.getElementById('1_'+y).value;
val2 = document.getElementById('2_'+y).value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
}
// check rows
for(var x = 0; x < x++)
{
val0 = document.getElementById(x + '_0').value;
val1 = document.getElementById(x + '_1').value;
val2 = document.getElementById(x + '_2').value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
}
// check top left to lower right diagonal
val0 = document.getElementById('0_0').value;
val1 = document.getElementById('1_1').value;
val2 = document.getElementById('2_2').value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
// check lower left to top right diagonal
val0 = document.getElementById('2_0').value;
val1 = document.getElementById('1_1').value;
val2 = document.getElementById('0_2').value;
if(val0 == 'X' && val1 == 'X' && val2 == 'X')
{
status.innerHTML = "X WINS!";
return true;
}
else if(val0 == 'O' && val1 == 'O' && val2 == 'O')
{
status.innerHTML = "O WINS!";
return true;
}
// no winner yet return false;
}
</SCRIPT>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
var xTurn = true;
</SCRIPT>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
var gameOver = false;
</SCRIPT>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
var numMoves = 0;
</SCRIPT>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
function squareclicked(square)
// squareclicked is a function that is called whenever a button is clicked.
{
var value = square.value;
if(value != 'X' && value != 'O')
{
if(xTurn)
{
square.value = 'X';
xTurn = false;
}
else
{
square.value = 'O';
xTurn = true;
}
}
else
alert('That square has already been played.');
}
</SCRIPT>
<SCRIPT TYPE="TEXT/JAVASCRIPT">
function squareclicked(square)
// squareclicked is a function that is called whenever a button is clicked.
{
var status = document.getElementById('status');
var value = square.value;
if(value != 'X' && value != 'O')
{
if(xTurn)
{
square.value = 'X';
xTurn = false;
status.innerHTML = 'O\'s turn';
}
else
{
square.value = 'O';
xTurn = true;
status.innerHTML = 'X\'s turn';
}
}
else
alert('That square has already been played.');
}
</SCRIPT>
</head>
<body>
<h1>Welcome To My Tic Tac Toe Game!</h1>
<table>
<BR>
<INPUT TYPE="BUTTON" ID="0_0" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="1_0" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="2_0" VALUE=" " ONCLICK="squareclicked(this);">
<BR>
<INPUT TYPE="BUTTON" ID="0_1" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="1_1" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="2_1" VALUE=" " ONCLICK="squareclicked(this);">
<BR>
<INPUT TYPE="BUTTON" ID="0_2" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="1_2" VALUE=" " ONCLICK="squareclicked(this);">
<INPUT TYPE="BUTTON" ID="2_2" VALUE=" " ONCLICK="squareclicked(this);">
<BR></td>
</tr>
</table>
<P ID="status">X's turn</P>
<INPUT TYPE="BUTTON" ID="NEWGAME" VALUE="New Game" ONCLICK="newgame(this);">
</body>
</html>
Thanks Nathan