js中的While循环出错



我正在创建一个猜测有限的数字。我添加了一个增量来检查用户提交答案的次数。除了循环从最后一次迭代开始,游戏在第一次尝试时结束之外,一切似乎都有效。

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="script.js" defer></script>
</head>
<body>
<div>Guess The Number</div>
<input type="text" id="input">
<button id="btn">Check Answer</button>
<p id="guesses" style="display: inline-block;"></p>
<p id="hint"></p>
</body>
</html>
const input = document.getElementById("input")
const btn = document.getElementById("btn")
const guesses = document.getElementById("guesses")
const rndmNum = Math.floor(Math.random() * 100) + 1;
btn.addEventListener('click', () => {
if(isNaN(input.value)){
input.value = "Please type a number"
} else{
const hint = document.getElementById("hint");
let i = 0;
while (i < 10){
if(input.value === rndmNum){
hint.innerHTML = "Congratulations, You guessed correctly!";
break;
} else if(input.value > rndmNum){
hint.innerHTML = "Too High";
} else{
hint.innerHTML = "Too low";
} i++; guesses.innerHTML = "You have guessed " + i + " times";
}
if(i === 10){
hint.innerHTML = "Game Over! The correct number was " + rndmNum;
} 
}
})

我试过在while循环条件下改变数字。我试过将增量移进和移出循环函数。我也试过聊天,看看它是否有效。但运气不好。我真的很感激你的帮助。

我想你误解了while循环。对于i从1到10的每个实例,循环将运行一次,然后在while循环中的条件为false时停止运行。根据你所提到的,你根本不想要一个循环,而是将猜测的数量存储到它自己的变量中,并增加该变量,直到达到你的极限。

const rndmNum = Math.floor(Math.random() * 100) + 1;
let numberOfGuesses = 0;
btn.addEventListener('click', () => {
if (isNaN(input.value)) {
return input.value = "Please type a number";
}

const hint = document.getElementById("hint");

if (input.value === rndmNum) {
hint.innerHTML = "Congratulations, You guessed correctly!";
return;
} else if (input.value > rndmNum) {
hint.innerHTML = "Too High";
} else {
hint.innerHTML = "Too low";
}
numberOfGuesses++;
guesses.innerHTML = "You have guessed " + numberOfGuesses + " times";

if (numberOfGuesses === 10) {
hint.innerHTML = "Game Over! The correct number was " + rndmNum;
}
})

我相信这就是你想要完成的。它不能与循环一起工作的原因是因为它会在点击一次按钮后运行十次。

const input = document.getElementById("input")
const btn = document.getElementById("btn")
const guesses = document.getElementById("guesses")
const rndmNum = Math.floor(Math.random() * 100) + 1;
//keep track of guess count
let count = 0;
//event listner to check the users answer
btn.addEventListener("click", checkAnswer)
//this function will check for answers or display game over
function checkAnswer(){
if(count > 9){
hint.innerHTML = "Game Over! The correct number was " + rndmNum;
} else if(input.value == rndmNum){
hint.innerHTML = "Congratulations, You guessed correctly!";
} else if(input.value > rndmNum){
hint.innerHTML = "Too High";
} else {
hint.innerHTML = "Too low";
}
count++
guesses.innerHTML = "You have guessed " + count + " times";
}

最新更新