- Để tạo một số random 1 to 100: Math.floor(Math.random() * 100);
- Để bắt sự kiện bấm phím trên cửa sổ web: window.addEventListener("keydown", keydownHandler, false);
- Để xóa một sự kiện trên một thành phần (ví dụ: button): button.removeEventListener("click", clickHandler, false);
Ngoài ra trong phiên bản này, ta giới hạn số lần bấm, chỉ cho phép người chơi đoán 10 lần, và số bí mật là một số ngẫu nhiên.
Ví dụ:
Đây là một số trong khoảng từ 1 đến 99
Code html5:
<!doctype html>
<meta charset="utf-8">
<title>Đoán số</title>
<p id="output">Đây là một số trong khoảng từ 1 đến 99</p>
<input id="input" type="text" placeholder="Điền số..." autofocus>
<button>Kiểm tra</button>
<script>
//Game variables
var mysteryNumber = Math.floor(Math.random() * 100);
console.log(mysteryNumber);
var playersGuess = 0;
var guessesRemaining = 10;
var guessesMade = 0;
var gameState = "";
var gameWon = false;
//The input and output fields
var input = document.querySelector("#input");
var output = document.querySelector("#output");
//The button
var button = document.querySelector("button");
button.addEventListener("click", clickHandler, false);
button.style.cursor = "pointer";
//Listen for enter key presses
window.addEventListener("keydown", keydownHandler, false);
function keydownHandler(event)
{
if(event.keyCode === 13)
{
validateInput();
}
}
function clickHandler()
{
validateInput();
}
function validateInput()
{
playersGuess = parseInt(input.value);
if(isNaN(playersGuess))
{
output.innerHTML = "Điền vào số.";
}
else
{
playGame();
}
}
function playGame()
{
guessesRemaining = guessesRemaining - 1;
guessesMade = guessesMade + 1;
gameState = " Số lần đã đoán: " + guessesMade + ", Còn lại: " + guessesRemaining;
playersGuess = parseInt(input.value);
if(playersGuess > mysteryNumber)
{
output.innerHTML = "Số này cao hơn số bí mật." + gameState;
//Check for the end of the game
if (guessesRemaining < 1)
{
endGame();
}
}
else
if(playersGuess < mysteryNumber)
{
output.innerHTML = "Số này thấp hơn số bí mật." + gameState;
//Check for the end of the game
if (guessesRemaining < 1)
{
endGame();
}
}
else if(playersGuess === mysteryNumber)
{
gameWon = true;
endGame();
}
}
function endGame()
{
if (gameWon)
{
output.innerHTML = "Số " + mysteryNumber + " chính là số cần tìm!" + "<br>" + "Bạn mất " + guessesMade + " lần đoán.";
}
else
{
output.innerHTML = "Không còn lựa chọn nào!" + "<br>" + "Số bí mật là: " + mysteryNumber + ".";
}
//Disable the button
button.removeEventListener("click", clickHandler, false);
button.disabled = true;
//Disable the enter key
window.removeEventListener("keydown", keydownHandler, false);
//Disable the input field
input.disabled = true;
}
</script>
No comments:
Post a Comment