Estou tentando acrescentar ao código o limite máximo de três tentativas ao usuário. Minha intenção é, após as três tentativas, fechar o local de digitação e pedir que o usuário atualize a página para tentar novamente.
Porém, após a primeira tentativa, o meu alert("ERROU! Tente novamente!") é executado três vezes e na sequência já pede que o usuário atualize a página para tentar novamente. Já tentei alterar o local da instrução, mas também não funcionou como gostaria.
<meta charset="utf-8">
<h1>Jogo da adivinhação</h1>
<hr>
<h3>Estou pensando em um número de 1 a 10. Tente adivinhar!</h3>
<input/>
<button>CHUTE</button>
<script>
var segredo = Math.round(Math.random() * 10);
var input = document.querySelector("input");
var maximoTentativas = 3;
var tentativas = 1;
function verifica() {
while (tentativas <= maximoTentativas) {
if (input.value == segredo) {
tentativas = maximoTentativas;
alert("PARABÉNS! Você acertou!");
} else {
alert("ERROU! Tente novamente!");
}
tentativas++;
}
document.write("<h2>Atualize a página e tente novamente!</h2>");
}
var button = document.querySelector("button");
button.onclick = verifica;
</script>