用JS写的简单的猜数的游戏，一个是步数限制的，一个是有时间限制的。

来源：互联网发布：c语言经典编程282例txt 编辑：程序博客网时间：2024/05/01 00:30

一、限制步数

<!doctype html><!--用于调试，请在console中查看每次的随机值--><html> <head>  <meta charset="UTF-8">  <title>限制步数的猜数游戏</title>  <style type="text/css">  </style> </head> <body><div id="con"><h3>每次猜数前请点击“获得随机数”，猜数的范围是1-100</h3>预测帝,come on:<input type="text" id="guessNumber" disabled="true" /> <input type="button" onclick="get()" value="获得随机数" id="get1"/><input type="button" onclick="game()" value="接下来就是见证奇迹的时刻" id="but" style="display:none;"/><input type="button" onclick="reset()" value="paly again" id="reset"/><p id="tip"></p> <p id="chishu"></p></div><script type="text/javascript">var num;//获得随机数var n =6;//定义步数 设置全局变量 可以自己修改 理论上7步是绝对能猜得到1-100的随机数的var get1 = document.getElementById("get1");var lost = document.getElementById("but");function game(){var now_guess = document.getElementById("guessNumber").value;var reg=/^[1-9]\d*$|^0$/;  //判断值的类型 提示输入1-100的整数if(reg.test(now_guess)==true){var guess = parseInt(now_guess);//转换数据的类型if(guess ==num){bingo();gameOver();}else if(guess>num){n--;tooHigh();}else{n--;tooLow();}}else{alert("请输入一个1-100的整数");}if(n==0) //判断每次点击后是否在规定步数内 {gameOver();alert("下次努力！数据是："+num);}}function bingo(){document.getElementById("tip").innerHTML="that's right";document.getElementById("chishu").innerHTML="";}function tooHigh(){document.getElementById("tip").innerHTML="有点大了兄弟";document.getElementById("chishu").innerHTML="你还有"+n+"步";document.getElementById("guessNumber").value="";}function tooLow(){document.getElementById("tip").innerHTML="太小了兄弟";document.getElementById("chishu").innerHTML="你还有"+n+"步";document.getElementById("guessNumber").value="";}function gameOver(){lost.style.display="None";get1.style.display="None";}function reset(){n = 6;document.getElementById("guessNumber").disabled = true;var lost = document.getElementById("but");get1.style.display="";document.getElementById("tip").innerHTML="";document.getElementById("chishu").innerHTML="你还有"+n+"步";num = getNum();document.getElementById("guessNumber").value="";}function getNum(){var rand = Math.floor(Math.random()*100+1);return rand;}function get(){document.getElementById("guessNumber").disabled = false;num = getNum();console.log(num);get1.style.display="None";lost.style.display="";}</script> </body></html>

二、限制时间

<!doctype html><!--用于调试，请在console中查看每次的随机值--><html> <head>  <meta charset="UTF-8">  <title>限制时间的猜数游戏</title>  <style type="text/css">  </style> </head> <body><div id="con"><h3>每次猜数前请点击“获得随机数”，猜数的范围是1-100</h3>预测帝,come on:<input type="text" id="guessNumber" disabled=true /><input type="button" onclick="get()" value="获得随机数" id="get1"/><input type="button" onclick="game()" value="接下来就是见证奇迹的时刻" id="but" style="display:none;"/><input type="button" onclick="reset()" value="paly again" id="reset"/><p id="tip"></p><p id="yourTime"></p></div><script type="text/javascript">var num;//获得随机数var n = 30;//定义时间 设置全局变量 时间为30秒var t;var time = document.getElementById("yourTime");function yourTime(){n--;time.innerHTML="你还有"+n+"秒";t = setTimeout("yourTime()",1000);if(n<=0){gameOver();alert("下次努力！数据是："+num);clearTimeout(t);}}var get1 = document.getElementById("get1");var lost = document.getElementById("but");function game(){var now_guess = document.getElementById("guessNumber").value;var reg=/^[1-9]\d*$|^0$/; if(reg.test(now_guess)==true){var guess = parseInt(now_guess);if(guess ==num){bingo();gameOver();}else if(guess>num){tooHigh();}else{tooLow();}}else{alert("请输入一个1-100的整数");}}function bingo(){document.getElementById("tip").innerHTML="that's right";}function tooHigh(){document.getElementById("tip").innerHTML="有点大了兄弟";document.getElementById("guessNumber").value="";}function tooLow(){document.getElementById("tip").innerHTML="太小了兄弟";document.getElementById("guessNumber").value="";}function gameOver(){lost.style.display="None";get1.style.display="None";clearTimeout(t);}function reset(){document.getElementById("guessNumber").disabled = true;n = 30;get1.style.display="";lost.style.display="None";document.getElementById("tip").innerHTML="";num = getNum();document.getElementById("guessNumber").value="";time.innerHTML="你还有"+n+"秒";clearTimeout(t);}function getNum(){var rand = Math.floor(Math.random()*100+1);return rand;}function get(){document.getElementById("guessNumber").disabled = false;num = getNum();console.log(num);get1.style.display="None";lost.style.display="";yourTime();}</script> </body></html>

0 0