I have this script that is supposed to check if a number the user guesses is the same as the randomly generated number.
Problem is that the random number generated at the start of the program keeps on changing everytime I click on the "Check if I'm right" button, the random number gets generated again and I never ever get to reach the correct answer.
Could someone please help/advise on what's wrong?
Thanks.
HTML CODE
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Number Guessing Game</title>
<link rel="stylesheet" href="style.css" type="text/css" />
<script type="text/javascript" src="script.js"></script>
</head>
<body class="body">
<div class="header">
Number Guessing Game
</div>
<div class="main">
<div class="content">
<p>
<img src="numbers.jpg" height="200px" width="278px" alt="Number guessing game graphic" />
</p>
<p>
Guess what number I am thinking of:
<form onsubmit="javascript:guessed(); return false;">
Type in a number between 1 and 10: <br />
<input type="text" name="guess" id="guess" /><br />
<input type="text" name="output" id="output" /><br />
<input type="submit" value="Check if I'm right" />
</form>
</p>
</div>
</div>
<div class="footer">
<p>Copyright © 2011 Number Guessing Game. <a href="mailto:tonye@brown.com">Report an issue :D</a>
</p>
</div>
</body>
</html>
Javascript code
function guessed()
{
var number = (Math.random() * 9) + 1;
var guessField = document.getElementById('guess');
var choice = guessField.value;
var win = 0;
while (win == 0)
{
if (choice > number)
{
var output = document.getElementById('output');
output.value = 'Guess lower';
win = 0;
}
else if (choice < number)
{
var output = document.getElementById('output');
output.value = 'Guess higher';
win = 0;
}
else
{
var output = document.getElementById('output');
output.value = 'Correct, you win!';
win = 1;
}
return false;
}
}