4
respostas

Botão reiniciar não funciona

<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>

app.js

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

4 respostas

Oi Natalia, tudo bem? 😊

Analisando seu código, percebi que você está quase lá para fazer o botão de reiniciar funcionar corretamente. 🤔

O problema está na lógica de desabilitar e habilitar os botões.

No seu código, você está desabilitando o botão "Novo jogo" (document.getElementById("reiniciar").setAttribute("disabled", true);) e habilitando o botão "Chutar" (document.querySelector('button').removeAttribute('disabled');).

O correto seria desabilitar o botão "Chutar" quando o jogo termina e habilitar o botão "Novo jogo".

Para corrigir isso, você pode fazer as seguintes alterações:

  1. No início do jogo, desabilite o botão "Novo jogo" e habilite o botão "Chutar".
  2. Quando o jogo terminar (acertar o número ou acabar as tentativas), desabilite o botão "Chutar" e habilite o botão "Novo jogo".
  3. Na função reiniciarJogo(), você deve desabilitar o botão "Novo jogo" e habilitar o botão "Chutar" novamente.

Segue um exemplo de como você pode fazer isso:

// No início do jogo
document.getElementById("reiniciar").setAttribute("disabled", true);
document.querySelector('.container__botoes button').removeAttribute('disabled');

function verificarChute() {
    // ... sua lógica de verificação de chute ...

    if (acertou || tentativas > maxTentativas) {
        document.querySelector('.container__botoes button').setAttribute('disabled', true);
        document.getElementById("reiniciar").removeAttribute('disabled');
    }
}

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

Neste exemplo, eu usei document.querySelector('.container__botoes button') para selecionar o botão "Chutar", pois ele está dentro da div com a classe container__botoes.

Lembre-se de adaptar o código ao seu projeto. 💻

🎓 Para saber mais:

Continue praticando e explorando novas possibilidades! 💪

tux matrixCaso este post o tenha ajudado,marque-o como solucionado ☑️.Bons Estudos! 🤓
            ola bom dia ,  infelizmente ainda estou batendo cabeca com esse codigo ,  consegui habilitar o botao porem quando eu clico nele nao acontece nada !   ja fiz algumas alteraçoes no JS e ainda assim sem resultado 

Natália, mostre como ficou seu código

Use:

aobas