1
resposta

[Dúvida] Resultado de uma variável não é definido, ao usar lo em uma função de clique de botão.

EU ESTOU FICANDO MALUCO

Estou a um tempo trabalhando em um programa html, que crie uma conta aleatória, e que o resultado seja inserido em um input, e ao clicar no botão sua verificação seja feita. E apareça uma mensagem de erro ou acerto. Segue o código:

<meta charset="UTF-8"> 

    <input>
    <button>
        Confirmar
    </button>  

<script>

    function pulaLinha () {
        document.write ("<br>");
    }

    function mostra (texto) {
        document.write (texto);
        pulaLinha ();
    }

    function mostraConta () { 

    let numeroUm = parseInt (Math.round ( Math.random () * 20 ));
    let numeroDois = parseInt (Math.round ( Math.random () * 10 ));
    let numeroTres = parseInt (Math.round ( Math.random () * 10 ));
    let conta = numeroUm + numeroDois * numeroTres - numeroUm ;
    let resultado = conta;

    mostra (resultado);
    mostra ( " Calcule a seguinte conta: " + numeroUm + "+" + numeroDois + "." + numeroTres + "-" + numeroUm  );
    pulaLinha ();
    mostra (" Insira o resultado no campo no topo da página, e confirma. ");

    }

    mostraConta ();

    let input = parseInt ( document.querySelector ("input"));
    let button = document.querySelector ("button");
    button.onclick = verifica; 

    function verifica() {
        if ( input.value  == resultado ) {
            alert ("PARABENS, VOCE ACERTOU!!!");
        } else {
            alert ("VOCE ERROU!");
        }
    }

</script>

Tentei diversas gambiarras e nenhuma deu certo. O problema mostrado pelo console do programa é exatamente a mensagem "adivinha_conta.html:42 Uncaught ReferenceError: resultado is not defined at HTMLButtonElement.verifica (adivinha_conta.html:42:23)"

Tentei diversos meios para resolver mas não consigo. Estou mais que aberto, estou arreganhado para sugestões e possiveis soluções; Estou com essa ânsia, pois sei que se eu não souber resolver isso agora no começo, é algo que vai me atormentar no futuro.

Print do programa: Insira aqui a descrição dessa imagem para ajudar na acessibilidade

1 resposta

Olá, Enzo! Tudo certo?

Para seu código funcionar eu fiz algumas alterações:

Dentro da função verifica() você usa a variável resultado, porém é uma variável que está dentro de mostraConta(). Ou seja, a variável resultado só pode ser acessada dentro da função mostraConta(). Para corrigir isso, eu coloquei todas as declarações de funções no começo do script, assim, todas as demais funções conseguirão acessar as variáveis dela.

Outra alteração foi nessa linha:

    let input = parseInt(document.querySelector("input"));

O resultado do querySelector é uma tag HTML. Ao usar o parseInt() você está tentando transformar essa tag em um número, o que não faz sentido, por isso o JavaScript retorna NaN, informando que o que você quer transformar para inteiro não é um número (Not a Number).

Uma possível solução construída com o seu código fica assim:

<meta charset="UTF-8">

<input>
<button>
    Confirmar
</button>

<script>
    let numeroUm = parseInt(Math.round(Math.random() * 20));
    let numeroDois = parseInt(Math.round(Math.random() * 10));
    let numeroTres = parseInt(Math.round(Math.random() * 10));
    let conta = numeroUm + (numeroDois * numeroTres) - numeroUm;
    let resultado = conta;

    function pulaLinha() {
        document.write("<br>");
    }

    function mostra(texto) {
        document.write(texto);
        pulaLinha();
    }

    function mostraConta() {
        mostra(resultado);
        mostra(" Calcule a seguinte conta: " + numeroUm + "+" + numeroDois + "." + numeroTres + "-" + numeroUm);
        pulaLinha();
        mostra(" Insira o resultado no campo no topo da página, e confirma. ");

    }

    mostraConta();

    let input = document.querySelector("input");
    let button = document.querySelector("button");
    button.onclick = verifica;

    function verifica() {
        console.log(input)
        console.log(resultado)
        if (input.value == resultado) {
            alert("PARABENS, VOCE ACERTOU!!!");
        } else {
            alert("VOCE ERROU!");
        }
    }

</script>

Espero que tenha ajudado e, qualquer coisa, estamos à disposição!

Abraços e bons estudos 😄


Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!