48 lines
		
	
	
		
			1.4 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			48 lines
		
	
	
		
			1.4 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<!DOCTYPE html>
 | 
						|
<html>
 | 
						|
  <head>
 | 
						|
    <meta charset="utf-8" />
 | 
						|
    <meta name="author" content="flykhan" />
 | 
						|
    <meta name="keywords" content="c c++ 物联网" />
 | 
						|
    <title>猜一猜小游戏</title>
 | 
						|
    <style>
 | 
						|
      .ok {
 | 
						|
        color: green;
 | 
						|
        font-size: 25px;
 | 
						|
        font-family: "楷体";
 | 
						|
      }
 | 
						|
 | 
						|
      .fail {
 | 
						|
        color: red;
 | 
						|
        font-size: 25px;
 | 
						|
        font-family: "仿宋";
 | 
						|
      }
 | 
						|
    </style>
 | 
						|
  </head>
 | 
						|
  <body>
 | 
						|
    <h3>请猜一下 1~10 的哪一个整数</h3>
 | 
						|
    <!-- input 的 onchange 表示输入数据之后回车,则调用的时间处理函数 -->
 | 
						|
    <input placeholder="建议大于10的整数" onchange="guest(this.value)" />
 | 
						|
    <div id="ret"></div>
 | 
						|
    <script>
 | 
						|
      // Math.random() 生成一个 0~1 之间的随机数 [0,1) 区间的小数
 | 
						|
      // Math.ceil() 上行取整
 | 
						|
      // Math.floor() 下行取整
 | 
						|
      var rand_n = parseInt(Math.random() * 10 + 1);
 | 
						|
      function guest(n) {
 | 
						|
        ret.innerText = "->" + n;
 | 
						|
        let input_n = parseInt(n);
 | 
						|
        if (input_n === rand_n) {
 | 
						|
          ret.innerHTML = "<span class='ok'> 恭喜您猜中了 </span>";
 | 
						|
        } else {
 | 
						|
          ret.innerHTML = "<span class='fail'> 加油,再猜一次试试</span>";
 | 
						|
        }
 | 
						|
 | 
						|
        // 生成新的随机数
 | 
						|
        rand_n = parseInt(Math.random() * 10 + 1);
 | 
						|
        console.log("新的随机数:" + rand_n);
 | 
						|
      }
 | 
						|
    </script>
 | 
						|
  </body>
 | 
						|
</html>
 |