<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<title>小学数学练习</title>
<style type="text/css">
#big_frame{
line-height:45px;
vertical-align:middle;
margin:40px auto;
}
#frame1{
border-width:1px;
border-style:solid;
border-color;#a16c;
width:544px;
height:50px;
}
#frame1 div{
border-width:1px;
border-style:solid;
border-color;#a16c;
border-top:none;
border-bottom:none;
border-left:none;
width:108px;
height:50px;
float:left;
line-height:45px;
vertical-align:middle;
background-color: skyblue;
}
#frame2{
border-width:1px;
border-style:solid;
border-color:black;
background-color:lightblue;
width:544px;
display:none;
border-top:none;
}
#result_inp{
background-color: skyblue;
}
#frame3{
border-width:1px;
border-style:solid;
border-color;#a16c;
border-top:none;
width:544px;
height:50px;
background-color:whitesmoke;
line-height:45px;
}
#frame3 button{
float:center;
width:110px;
height:30px;
border-color: lightblue;
line-height:20px;
vertical-align:middle;
background-color: skyblue;
} div#div1{
position:fixed;
top:0;
left:0;
bottom:0;
right:0;
z-index:-1;
}
div#div1 > img {
height:100%;
width:100%;
border:0;
}
}
</style>

<script>
var left_num;
var op;
var right_num;
var result;

var count;
var remain;
var i=1;
var sign;
left_num = document.getElementById("left_num");
op = document.getElementById("op");
right_num = document.getElementById("right_num");
result = document.getElementById("result");

}
function join(){
i = 1;
document.getElementById("result_inp").disabled = false;
result_inp.value = " ";
document.getElementById("frame2").innerHTML = " ";
frame2.style.display = "none";
var temp = Number(prompt("你想在这练习几道题？",""))
if(!temp){
}
else{
count = temp;
remain = count;
join_btn.disabled = true;
start_btn.disabled = null;
}
}
function start(){
start_btn.disabled = true;
creatQuestion()
document.getElementById("left_num").innerHTML=left_num ;
document.getElementById("right_num").innerHTML=  right_num  ;
document.getElementById("op").innerHTML=  sign  ;
result_inp.focus();
}
function creatQuestion(){
op = Math.floor(Math.random()*4);
switch(op)
{
case 0:
sign = " + ";
left_num= Math.floor(10+Math.random()*90);
right_num = Math.floor(10+Math.random()*90);

break;
case 1:
sign = " - ";
right_num = Math.floor(10+Math.random()*90);
left_num=right_num + Math.floor(10+Math.random()*90);

break;
case 2:
sign = " ×";
left_num = Math.floor(10+Math.random()*90);
right_num = Math.floor(10+Math.random()*90);

break;
case 3:
sign = " ÷";
right_num= Math.floor(10+Math.random()*90);
left_num = right_num * Math.floor(1+Math.random()*10);

break;
}

}
function inp(){
var code=event.keyCode;

var signtf;

if ((code < 48 && code != 13) || (code > 57 && code <96) || code > 105 ){
result_inp.value =result_inp.value.substring(0,result_inp.value.length-1);
}

else if(code == 13){
{ signtf = "真棒！你做对啦！";tanswer += 1;}
else
{ signtf = "做错啦，是不是粗心啦？";}
tanswer += 1;document.getElementById("frame2").innerHTML += "第" + i  +"题：" +signtf + "  ，正确答案：" + answer + "， 你的答案：  " + you_answer +" <br / >";
i = i +1;
result_inp.value = "";
remain--;
if(remain != 0){
creatQuestion();
document.getElementById("left_num").innerHTML=""+left_num+"" ;
document.getElementById("right_num").innerHTML= ""+ right_num +"" ;
document.getElementById("op").innerHTML= ""+ sign +"" ;

}
else{

result_inp.value="已完成";
show_btn.disabled = null;

document.getElementById("frame2").innerHTML += "满分为一百，你得到的分数为：" + grade + "分" + " <br / > 小朋友再接再厉哦！";
document.getElementById("result_inp").disabled = "true";

}

}
}
function compute(){
frame2.style.display = "block";
show_btn.disabled = true;
join_btn.disabled = null;
}
</script>
<body >
<div id="div1"><img src="111.jpg" /></div>
<div id="big_frame" align="center">
<div id="frame1">
<div id="left_num"></div>
<div id="op"></div>
<div id="right_num"></div>
<div >=</div>
<div id="result" style="border-right:none">
<input  id= "result_inp" type="text"   style="width:106px;height:47px; border: 0;" value="" readonly  onkeyup="inp()" >
</div>
</div>
<div id="frame2">

</div>
<div id="frame3" >
<button id="join_btn" onclick="join()"  >参加测试</button>
<button id= "start_btn"  disabled  onclick="start()" >开始出题</button>
<button id= "show_btn" disabled onclick="compute()">显示结果</button>
</div>
</div>
</body>
</html>

4个回答

event对象没有做兼容性处理

function inp(){
var event = arguments.callee.caller.arguments[0] || window.event;
var code= event.which || event.keyCode;