JS练习——猜数字

基本框架:
<!DOCTYPE html>
<html>
<head lang=”en”>
<meta charset=”UTF-8″>
<title></title>
<script language=”JavaScript”>
var hiddenRandom;
function func2()
{
hiddenRandom = Math.ceil(Math.random() * 100);
}

function func1()
{
var oneRandom = document.getElementById(“oneRandom”).value;
if (hiddenRandom > oneRandom) {
alert(“太小了”);
}
else if (hiddenRandom < oneRandom) {
alert(“太大了”);
}
else {
alert(“猜中了”);
}

}
</script>
</head>
<body onload=”func2()”>
<form name=”myFrm”>
你猜一个数字(1-100):
<input type=”text” id=”oneRandom” size=”12″/>
<br/>
<input type=”button” value=”计算” onclick=”func1()”/>
</form>

</body>
</html>

 

增加判断次数
<!DOCTYPE html>
<html>
<head lang=”en”>
<meta charset=”UTF-8″>
<title></title>
<script language=”JavaScript”>
var count=0;
var hiddenRandom;
function func2()
{
hiddenRandom = Math.ceil(Math.random() * 100);
alert(hiddenRandom);
}

function func1()
{
count++;
var oneRandom = document.getElementById(“oneRandom”).value;
if (hiddenRandom > oneRandom) {
alert(“太小了”);
}
else if (hiddenRandom < oneRandom) {
alert(“太大了”);
}
else {
alert(“猜中了!你猜了”+count+”次!”);
}

}
</script>
</head>
<body onload=”func2()”>
<form name=”myFrm”>
你猜一个数字(1-100):
<input type=”text” id=”oneRandom” size=”12″/>
<br/>
<input type=”button” value=”计算” onclick=”func1()”/>
</form>

</body>
</html>

 

使用DIV显示判断结果
<!DOCTYPE html>
<html>
<head lang=”en”>
<meta charset=”UTF-8″>
<title></title>
<script language=”JavaScript”>
var count = 0;
var hiddenRandom;
function func2() {
hiddenRandom = Math.ceil(Math.random() * 100);
alert(hiddenRandom);
}

function func1() {
count++;
var oneRandom = document.getElementById(“oneRandom”).value;
if (hiddenRandom > oneRandom) {
document.getElementById(“result”).innerHTML = “太小了”;
}
else if (hiddenRandom < oneRandom) {
document.getElementById(“result”).innerHTML = “太大了”;
}
else {
document.getElementById(“result”).innerHTML = “猜中了!你猜了” + count + “次!”;
}
document.myFrm.oneRandom.focus();
}
</script>
</head>
<body onload=”func2()”>
<form name=”myFrm”>
你猜一个数字(1-100):
<input type=”text” name=”oneRandom” id=”oneRandom” size=”12″/>
<br/>

<div id=”result”></div>
<br/>
<input type=”button” value=”计算” onclick=”func1()”/>
</form>

</body>
</html>

 

完整版本:实现了回车自动判断
<!DOCTYPE html>
<html>
<head lang=”en”>
<meta charset=”UTF-8″>
<title></title>
<script language=”JavaScript”>
var count = 0;
var hiddenRandom;
function func2() {
hiddenRandom = Math.ceil(Math.random() * 100);
document.myFrm.oneRandom.focus();
alert(hiddenRandom);
}

function func1() {
if (event.keyCode == 13) {
count++;
var oneRandom = document.getElementById(“oneRandom”).value;
if (hiddenRandom > oneRandom) {
document.getElementById(“result”).innerHTML = “太小了”;
}
else if (hiddenRandom < oneRandom) {
document.getElementById(“result”).innerHTML = “太大了”;
}
else {
document.getElementById(“result”).innerHTML = “猜中了!你猜了” + count + “次!”;
}
document.myFrm.oneRandom.focus();
return false;
}
else
return true;
}
</script>
</head>
<body onload=”func2()”>
<form name=”myFrm”>
你猜一个数字(1-100):
<input type=”text” name=”oneRandom” id=”oneRandom” size=”12″ onkeydown=”javascript:return func1();”/>
<br/>

<div id=”result”></div>
<br/>
</form>

</body>
</html>

发表评论

邮箱地址不会被公开。 必填项已用*标注