PDA

View Full Version : javascript application does't work



ann.onimus07
28 Mar 2012, 02:28 AM
Hello, everyone.
I am new to JavaScript, trying to write an application which should help people learn Chinese Characters easier.
JavaScript should output a Chinese Character (Hanzi) and the user should type in the right pronunciation (Pinyin) of that Hanzi. Then Javascript should evaluate the input of the user and Alert him whether is right or wrong. I dont' know what is wrong with my javascript code. Here it is:

<html>
<head>
<title>Chinese Characters Test</title>

<!-- Your browser encoding should be set to Unicode (UTF-8) or Chinese Simplified in order to see the Chinese Characters-->

<style>
table {border: 2px solid black; width: 200px; height: 400px; text-align: center;}
#td1 {border: 1px solid black; width: 200px; height: 200px; font-family: FreeSans; font-size: 54px; font-weight: bold;}
#td2 {font-size: 14px; font-family: FreeSans; font-weight: bold; background-color: yellow;}
input {text-align: center;}
</style>
<script type="text/javascript" >

var Hanzi = new Array();
Hanzi[0]="吃";
Hanzi[1]="反";
Hanzi[2]="水";
Hanzi[3]="果";
Hanzi[4]="菜";
Hanzi[5]="些";
Hanzi[6]="市";
Hanzi[7]="场";

var pinyin = new Array();
pinyin[0]="chi1";
pinyin[1]="fan4";
pinyin[2]="shui3";
pinyin[3]="guo3";
pinyin[4]="cai4";
pinyin[5]="xie1";
pinyin[6]="shi4";
pinyin[7]="chang3";

Hanzi[0]== pinyin[0];
Hanzi[1]== pinyin[1];
Hanzi[2]== pinyin[2];
Hanzi[3]== pinyin[3];
Hanzi[4]== pinyin[4];
Hanzi[5]== pinyin[5];
Hanzi[6]== pinyin[6];
Hanzi[7]== pinyin[7];


function randHanzi(){
randHanzi = Math.floor ( Math.random() * Hanzi.length );
document.write(Hanzi[randHanzi]);
}

function evalInput(){
document.getElementById('userInput').value ="";

if((document.write(Hanzi[randHanzi]) == Hanzi[0]) && (document.getElementById('userInput').value == pinyin[0])){
alert('Your answer is Correct!');
}

if((document.write(Hanzi[randHanzi]) == Hanzi[1]) && (document.getElementById('userInput').value == pinyin[1])){
alert('Your answer is Correct!');
}

if((document.write(Hanzi[randHanzi]) == Hanzi[2]) && (document.getElementById('userInput').value == pinyin[2])){
alert('Your answer is Correct!');
}

if((document.write(Hanzi[randHanzi]) == Hanzi[3]) && (document.getElementById('userInput').value == pinyin[3])){
alert('Your answer is Correct!');
}

if((document.write(Hanzi[randHanzi]) == Hanzi[4]) && (document.getElementById('userInput').value == pinyin[4])){
alert('Your answer is Correct!');
}

if((document.write(Hanzi[randHanzi]) == Hanzi[5]) && (document.getElementById('userInput').value == pinyin[5])){
alert('Your answer is Correct!');
}

if((document.write(Hanzi[randHanzi]) == Hanzi[6]) && (document.getElementById('userInput').value == pinyin[6])){
alert('Your answer is Correct!');
}

if((document.write(Hanzi[randHanzi]) == Hanzi[7]) && (document.getElementById('userInput').value == pinyin[7])){
alert('Your answer is Correct!');
}

else {
alert('Your answer is Wrong!');
}
}

</script>
</head>
<body>
<table>
<tr>
<td id="td1">
<script type="text/javascript" >randHanzi()</script>
</td>
</tr>
<tr>
<td id="td2">Type your answer in the box bellow!<br>Please use Pinyin<br> ex: wo3
<form>
<input id="userInput" type="text"/>
<input type="submit" value="Press to submit" onclick="evalInput()"/>
</form>
</td>
</tr>
</table>
</body>
</html>


Can somebody help me with this?