<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
#wrap{
width: 500px;
height: 80px;
overflow: hidden;
}
#clock {
float: left;
width: 60px;
height: 20px;
background-color: black;
color: white;
font-size: 14px;
margin: 10px;
}
#div1,#div2,#div3,#div4 {
width: 50px;
height: 20px;
border: 1px solid springgreen;
float: left;
margin: 30px 5px;
text-align: center;
line-height: 20px;
}
#text {
width: 50px;
height: 20px;
border: 1px solid deeppink;
float: left;
margin:30px 5px;
text-align: center;
line-height: 20px;
}
</style>
</head>
<body>
<div id="wrap">
<div id="clock"><span>时间：</span><span>5</span></div>
<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
<div id="div4">=</div>
<input type="text" name="text" id="text" value="" />
</div>
<script type="text/javascript">
var jiShi = document.body.firstElementChild.firstElementChild.lastElementChild.innerHTML;
var oDiv1 = document.getElementById("div1");
var oDiv2 = document.getElementById("div2");
var oDiv3 = document.getElementById("div3");
var oText = document.getElementById("text");
var arr = ["+", "-", "*", "/"];
oDiv2.innerHTML = arr[random(0,3)];
oDiv1.innerHTML = random(0,10);
if (oDiv2.innerHTML == "/") {
oDiv3.innerHTML = random(1,10);
}else{
oDiv3.innerHTML = random(0,10);
}
function random(min, max){
return Math.floor(Math.random() * (max - min + 1) + min);
};
var timer = null;
timer = setInterval(function(){
jiShi--; document.body.firstElementChild.firstElementChild.lastElementChild.innerHTML = jiShi;
var result = oDiv1.innerHTML + oDiv2.innerHTML + oDiv3.innerHTML;
while (jiShi == 0){
if (oText.value == "") {
alert("对不起，您超时啦！继续努力！");
}else if (oText.value == parseInt(eval(result))) {
alert("Congratulation！！");
}else{
alert("很遗憾，回答错误！");
}
clearInterval(timer);
jiShi = 5;
}
},1000);
</script>
</body>
</html>
595
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
