Click to See Complete Forum and Search --> : maths game


neil9999
08-28-2003, 05:53 AM
Hi,

I'm making a maths game which doesn't seem to be working. If you click on Next and you have 'Add' selected, it ask you to add two random numbers between 1 and 10 and the next button changes to an enter button (which was working fine before). Then if you enter the (correct) answer into the little box the box in which the question was in should say 'Correct'.

Here's the code:

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta http-equiv="Content-Language" content="en-gb">
<title></title>
</head>

<body bgcolor="#FF0000">

<script language=javascript>

function next(){

e1=(Math.floor(Math.random() * (1 - 10)) + 10);
e2=(Math.floor(Math.random() * (1 - 10)) + 10);

if(document.getElementById('next').value=="Next" && document.getElementById('type').value=="a"){document.getElementById('next').value='Enter'; add()};
if(document.getElementByld('next').value=="Enter" && document.getElementByld('answer').value==e1+e2){document.getElementById('question').value='Correct'} ;

function add(){
if(document.getElementById('level').value=="e"){document.getElementById('question').value=e1+' plus '+e2;}

}
</script>
<table border="0" width="198" height="99" bordercolor="#000000" style="background-color: #FFFF00; border-style: solid">
<tr>
<td height="33" width="47" colspan="2">
<p align="center">
<select size="1" name="type" id=type>
<option value="a" selected>Add</option>
<option value="t">Take away</option>
<option value="m">Multiply</option>
<option value="d">Divide</option>
</select></p>
</td>
<td height="33" width="52" colspan="2">
<p align="center">
<select size="1" name="level" id=level>
<option value="e" selected>Easy</option>
<option value="m">Medium</option>
<option value="h">Hard</option>
</select></p>
</td>
</tr>
<tr>
<td height="33" width="99" colspan="4">
<p align="center">
<input type="text" name="T1" size="27" id=question>
</p>
</td>
</tr>
<tr>
<td height="33" width="23">
<p align="center"><input type="text" name="answer" size="6" id=answer></td>
<td height="33" width="56" colspan="2">
<p align="center"><button onclick=next() id=next>Next</button></td>
<td height="33" width="24">
<p align="center"><button>Reset</button></td>
</tr>
<tr>
<td height="33" width="23">
<p align="center">Score %:</td>
<td height="33" width="56" colspan="2">
<p align="center">Score Marks:</td>
<td height="33" width="24">
<p align="center">Out of:</td>
</tr>
<tr>
<td height="33" width="23">
<p align="center"><input type="text" name="T1" size="3" id=scorepercent></td>
<td height="33" width="56" colspan="2">
<p align="center"><input type="text" name="T1" size="3" id=score></td>
<td height="33" width="24">
<p align="center"><input type="text" name="T1" size="3" id=outof></td>
</tr>
</table>
</body>
</html>

What have i done wrong?

Thanks,

Neil

neil9999
08-28-2003, 05:54 AM
Woops, 'easy' needs to be selected aswell.

Thanks,

Neil

Khalid Ali
08-28-2003, 07:39 AM
:)

If you have not figured it out yet that is.
just make this change

value==e1+e2

value==(e1+e2)

If nothing else is wrong then it should work.

neil9999
08-28-2003, 09:42 AM
Thanks, I changed that but it still doesn't work. It says it expects a '}' but I can't find any missing. Please could you tell me what's wrong with this?

Thanks,

Neil
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta http-equiv="Content-Language" content="en-gb">
<title></title>
</head>

<body bgcolor="#FF0000">

<script language=javascript>

function next(){

e1=(Math.floor(Math.random() * (1 - 10)) + 10);
e2=(Math.floor(Math.random() * (1 - 10)) + 10);

if(document.getElementById('next').value=="Next" && document.getElementById('type').value=="a"){document.getElementById('next').value='Enter'; add()};
if(document.getElementByld('next').value=="Enter" && document.getElementByld('answer').value==(e1+e2)){document.getElementById('question').value='Correct '};

function add(){
if(document.getElementById('level').value=="e"){document.getElementById('question').value=e1+' plus '+e2;}

}
</script>
<table border="0" width="198" height="99" bordercolor="#000000" style="background-color: #FFFF00; border-style: solid">
<tr>
<td height="33" width="47" colspan="2">
<p align="center">
<select size="1" name="type" id=type>
<option value="a" selected>Add</option>
<option value="t">Take away</option>
<option value="m">Multiply</option>
<option value="d">Divide</option>
</select></p>
</td>
<td height="33" width="52" colspan="2">
<p align="center">
<select size="1" name="level" id=level>
<option value="e" selected>Easy</option>
<option value="m">Medium</option>
<option value="h">Hard</option>
</select></p>
</td>
</tr>
<tr>
<td height="33" width="99" colspan="4">
<p align="center">
<input type="text" name="T1" size="27" id=question>
</p>
</td>
</tr>
<tr>
<td height="33" width="23">
<p align="center"><input type="text" name="answer" size="6" id=answer></td>
<td height="33" width="56" colspan="2">
<p align="center"><button onclick=next() id=next>Next</button></td>
<td height="33" width="24">
<p align="center"><button>Reset</button></td>
</tr>
<tr>
<td height="33" width="23">
<p align="center">Score %:</td>
<td height="33" width="56" colspan="2">
<p align="center">Score Marks:</td>
<td height="33" width="24">
<p align="center">Out of:</td>
</tr>
<tr>
<td height="33" width="23">
<p align="center"><input type="text" name="T1" size="3" id=scorepercent></td>
<td height="33" width="56" colspan="2">
<p align="center"><input type="text" name="T1" size="3" id=score></td>
<td height="33" width="24">
<p align="center"><input type="text" name="T1" size="3" id=outof></td>
</tr>
</table>
</body>
</html>

Khalid Ali
08-28-2003, 10:08 AM
take a look at your js code

function next(){

function starts but it does not end with a closing curly brace??

Nevermore
08-28-2003, 10:14 AM
I have found a problem but haven't yet got the code working. In line 37, in which it was finding an error, the I in Id had been replaced by a 1.

Nevermore
08-28-2003, 10:26 AM
Fixed it! Other than the weird 1 instead of an I problwm, you were calling the random number thing when someone submitted an answer, so that it changed the sum it was 'thinking of' before it checked their answer. I.e. it was telling you the wrong question. Fixed it by putting the random number code in the add() function.


<html>



<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

<meta http-equiv="Content-Language" content="en-gb">

<title></title>

</head>



<body bgcolor="#FF0000">



<script type="text/javascript">



function next1(){






if(document.getElementById('next').value=="Next" && document.getElementById('type').value=="a"){document.getElementById('next').value='Enter'; add();}

else if(document.getElementById('next').value=="Enter" && document.getElementById('answer').value==(e1+e2))
{ document.getElementById('question').value='Correct';}
}



function add(){
e1=Math.floor(Math.random() * 10);

e2=Math.floor(Math.random() * 10);
if(document.getElementById('level').value=="e"){document.getElementById('question').value=e1+' plus '+e2;}



}

</script>

<table border="0" width="198" height="99" bordercolor="#000000" style="background-color: #FFFF00; border-style: solid">

<tr>

<td height="33" width="47" colspan="2">

<p align="center">

<select size="1" name="type" id='type'>

<option value="a" selected>Add</option>

<option value="t">Take away</option>

<option value="m">Multiply</option>

<option value="d">Divide</option>

</select></p>

</td>

<td height="33" width="52" colspan="2">

<p align="center">

<select size="1" name="level" id=level>

<option value="e" selected>Easy</option>

<option value="m">Medium</option>

<option value="h">Hard</option>

</select></p>

</td>

</tr>

<tr>

<td height="33" width="99" colspan="4">

<p align="center">

<input type="text" name="T1" size="27" id='question'>

</p>

</td>

</tr>

<tr>

<td height="33" width="23">

<p align="center"><input type="text" name="answer" size="6" id='answer'></td>

<td height="33" width="56" colspan="2">

<p align="center"><button onclick='next1()' id='next'>Next</button></td>

<td height="33" width="24">

<p align="center"><button>Reset</button></td>

</tr>

<tr>

<td height="33" width="23">

<p align="center">Score %:</td>

<td height="33" width="56" colspan="2">

<p align="center">Score Marks:</td>

<td height="33" width="24">

<p align="center">Out of:</td>

</tr>

<tr>

<td height="33" width="23">

<p align="center"><input type="text" name="T1" size="3" id=scorepercent></td>

<td height="33" width="56" colspan="2">

<p align="center"><input type="text" name="T1" size="3" id=score></td>

<td height="33" width="24">

<p align="center"><input type="text" name="T1" size="3" id=outof></td>

</tr>

</table>

</body>
</html>

neil9999
08-28-2003, 11:03 AM
Hi, thanks for all yours help, it works fine now. One question - is it possible to round a number in a textbox to 0 decimal places?(or to the nearest 1?)

Thanks again,

Neil

Nevermore
08-28-2003, 11:14 AM
yeah, Math.round() will round it to the nearest whole number. E.g. Math.round(e1);. To round to a certain number of decimals you multiply by 10 first for each ddecimal place. To round to 1 dp you would use:
e1*=10; e1=Math.round(e1); e1/=10;

neil9999
08-29-2003, 07:40 AM
Thanks, so if I have a script that puts a number into a textbox, how do i round it to the nearest whole number?

Thanks,

Neil

Nevermore
08-29-2003, 10:44 AM
You use Math.round(). If your variable is e, you would put e=Math.round(e); Then you just use the variable as you were before.