頁面(html/jsp)的猜數字小遊戲
阿新 • • 發佈:2019-02-19
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>猜數字小遊戲</title> <style type="text/css"> #my_guess_num { height: 18px; vertical-align: middle; text-align: center; line-height: 18px; /*line-height must be equal to height*/ } </style> </head> <script> var count = 1; var num = null; //獲取隨機數 function GetRandomNum(Min, Max) { count = 1; var Range = Max - Min; var Rand = Math.random(); num = Min + Math.round(Rand * Range); alert("隨機數已生成,請開始猜吧!" + num) } //獲取文字框內容 function checknum() { if (num == null) { alert("請先生成一個隨機數再開始猜哦!"); return; } var nums = document.getElementById("my_guess_num").value; if ("" == nums) { alert("請輸入您要猜的數!"); return; } if (nums == num) { alert("恭喜您嘗試" + count + "次猜對了!"); return; } else { alert("已猜次數" + count) if (count == 10) { if (nums != num) { alert("猜錯了,您已經沒機會了,真遺憾!重新生成隨機數再來一次吧!") return; } } if (nums < num) { alert("數字有些小了,您還有" + (10 - count) + "次機會"); } else { alert("數字有些大了,您還有" + (10 - count) + "次機會"); } count++; } } </script> <body> <h1>猜數字小遊戲</h1> 說明:點選【生成隨機數】產生一個1-99的隨機數,然後輸入您要猜的數字,點選【猜】即可;共有10次機會; <br /> <br /> <input type="button" id="result" name="result" onclick="GetRandomNum(1,100)" value="生成隨機數" /> <br /> <br /> <input type="text" id="my_guess_num" name="my_guess_num" /> <input type="button" id="guess" name="guess" onclick="checknum()" value="猜" /> </body> </html>