Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

botão de reiniciar jogo não funciona

Quando clico no botão "Novo Jogo", a função criada no js não é executada. Aparece no console que existe um erro no meu HTML, porém não consegui entender esse erro.

HTML:

<div class="container">
    <div class="container__conteudo">
        <div class="container__informacoes">
            <div class="container__texto">
                <h1></h1>
                <p class="texto__paragrafo"></p>
            </div>
            <input type="number" min="1" max="10" class="container__input">
            <div class="chute container__botoes">
                <button onclick="verificarChute()" class="container__botao">Chutar</button>
                <button onclick="reiniciarJogo()" id="reiniciar" class="container__botao" disabled>Novo jogo</button>
            </div>
        </div>
        <img src="./img/ia.png" alt="Uma pessoa olhando para a esquerda" class="container__imagem-pessoa" />
    </div>
</div>




<script src="app.js" defer></script>
2 respostas

código no js:

let numeroSecreto = gerarNumeroAleatorio();
let numeroDeTentativas = 1;
exibirMensagemInicial();

function exibirTextoNaTela(tag, texto) {
    let campo = document.querySelector(tag);
    campo.innerHTML = texto; 
};

function exibirMensagemInicial(){
    exibirTextoNaTela(`h1`, `Jogo do número secreto`);
    exibirTextoNaTela(`p`, `Escolha um número entre 1 e 10`);

}

function gerarNumeroAleatorio() {
    return parseInt(Math.random() * 10 + 1)
};


function verificarChute() {
    let chute = document.querySelector(`input`).value


   if (chute == numeroSecreto) {
    exibirTextoNaTela(`h1`, `Acertou!!`);
    let palavraTentativa = numeroDeTentativas > 1 ? `tentativas` : `tentativa`;
    let mensagemTentativas = `Você descobriu o Número secreto com ${numeroDeTentativas} ${palavraTentativa}`;
    exibirTextoNaTela(`p`, ` ${mensagemTentativas}`);

    document.getElementById(`reiniciar`).removeAttribute(`disabled`);
   } else {
    if (chute < numeroSecreto) {
        exibirTextoNaTela(`p`, `O número secreto é maior que ${chute}`);
    } else {
        exibirTextoNaTela(`p`, `O número secreto é menor que ${chute}`);
    }
    numeroDeTentativas++
    limparCampo();
   };

   function limparCampo(){
    chute = document.querySelector(`input`);
    chute.value = ``;
}

function reiniciarJogo() {
    numeroSecreto = gerarNumeroAleatorio();
    limparCampo();
    tentativas = 1;
    exibirMensagemInicial();
    document.getElementById('reiniciar').setAttribute('disabled', true);
}

};

solução!

Opa, Fagner!

O erro está no fechamento da função verificarChute(), a chave que está fechando ela está lá embaixo e ta colocando as funções limparCampo() e reiniciarJogo() dentro dela.

É só fechar a função verificarChute() logo antes da limparCampo(), assim:

function verificarChute() {
    let chute = document.querySelector(`input`).value


   if (chute == numeroSecreto) {
    exibirTextoNaTela(`h1`, `Acertou!!`);
    let palavraTentativa = numeroDeTentativas > 1 ? `tentativas` : `tentativa`;
    let mensagemTentativas = `Você descobriu o Número secreto com ${numeroDeTentativas} ${palavraTentativa}`;
    exibirTextoNaTela(`p`, ` ${mensagemTentativas}`);

    document.getElementById(`reiniciar`).removeAttribute(`disabled`);
   } else {
    if (chute < numeroSecreto) {
        exibirTextoNaTela(`p`, `O número secreto é maior que ${chute}`);
    } else {
        exibirTextoNaTela(`p`, `O número secreto é menor que ${chute}`);
    }
    numeroDeTentativas++
    limparCampo();
   };
} // Deveria estar aqui

function limparCampo(){
    chute = document.querySelector(`input`);
    chute.value = ``;
}

function reiniciarJogo() {
    numeroSecreto = gerarNumeroAleatorio();
    limparCampo();
    tentativas = 1;
    exibirMensagemInicial();
    document.getElementById('reiniciar').setAttribute('disabled', true);
}

//}; Está aqui