Código para gerar um alerta após input em um form

JavaScript

Estou com uma duvida, do por que não aparece o resultado no alert neste codigo abaixo:

Mesmo que eu tenha declarado as variaveis xx e yy nao retorna o valor no alert.

Estou usando o VScode.

<body>

    <form  method="get">
    <!--Numeros-->
    X: <input type="number" id="x" placeholder="Digite o 1º numero" required  /> <br/>
    Y: <input type="number" id="y" placeholder="Digite o 2º numero" required  /> <br/>
       
    <!--Operador: <input type="text" id="operador" placeholder="Digite: + ou - ou * ou /"  /> <br/>-->
    </form>

    <button onclick="myfunc()">Calcular</button>
    <inputtype="button"value="Atualizar"onClick="window.location.reload()">

</body>
     
    <script type="text/javascript">

    var resultadofinal = soma(xx, yy);
    var xx = document.getElementById("x").value;
    var yy = document.getElementById("y").value;

    function soma(){
        var xx = document.getElementById("x").value;
        var yy = document.getElementById("y").value;
        return xx + yy;
        }
       
       
        //Funcao para mostrar o valor do input
        function myfunc(){
            //var num1 = parseInt(document.getElementById("num1").value) || null;
            alert('Resultado é: ' + resultadofinal);
        }

        // Evento que é executado toda vez que uma tecla for pressionada no input
        document.getElementById("y").onkeypress = function(e) {
        // 13 é a tecla <ENTER>. Se ela for pressionada, mostrar o valor
        if (e.keyCode == 13) {
            myfunc();
            e.preventDefault();
        }
    }
                 
    </script>
Foto de Fellipe C.
Fellipe perguntou há 10 meses

Sabe a resposta?

Ganhe 10 pts por resposta de qualidade
Responder dúvida
1 resposta
1
votos
1 usuário votou nessa resposta como útil.
Professor Hugo L.
Identidade verificada
  • CPF verificado
  • E-mail verificado
Respondeu há 8 meses

Parece que o problema no seu código está relacionado ao momento em que você está calculando o resultado da soma e pegando os valores dos campos de entrada (xx e yy). No momento em que você está calculando o resultado final, as variáveis xx e yy ainda não têm os valores dos campos de entrada, então o resultado final não é calculado corretamente.

Aqui está uma versão corrigida do seu código:

<body>
    <form method="get">
        <!--Numeros-->
        X: <input type="number" id="x" placeholder="Digite o 1º numero" required /><br />
        Y: <input type="number" id="y" placeholder="Digite o 2º numero" required /><br />
    </form>

    <button onclick="myfunc()">Calcular</button>
    <input type="button" value="Atualizar" onClick="window.location.reload()">
    
    <script type="text/javascript">
        // Funcao para realizar a soma dos valores
        function soma(x, y) {
            return x + y;
        }

        // Funcao para mostrar o valor do input
        function myfunc() {
            var xx = parseInt(document.getElementById("x").value);
            var yy = parseInt(document.getElementById("y").value);
            var resultadofinal = soma(xx, yy);
            alert('Resultado é: ' + resultadofinal);
        }

        // Evento que é executado toda vez que uma tecla for pressionada no input
        document.getElementById("y").onkeypress = function(e) {
            // 13 é a tecla <ENTER>. Se ela for pressionada, mostrar o valor
            if (e.keyCode == 13) {
                myfunc();
                e.preventDefault();
            }
        }
    </script>
</body>

Nesta versão corrigida, o cálculo da soma é feito dentro da função myfunc(), após obter os valores dos campos de entrada (xx e yy). Isso garante que os valores sejam atualizados corretamente antes de calcular o resultado da soma e exibir o alerta.


Envie uma dúvida gratuitamente

Envie sua primeira dúvida gratuitamente aqui no Tira-dúvidas Profes. Nossos professores particulares estão aqui para te ajudar.

Professores particulares de JavaScript

+ Ver todos
Encontre professor particular para te ajudar nos estudos
R$ 75 / h
Hugo L.
Rio de Janeiro / RJ
Hugo L.
4,7 (16 avaliações)
Horas de aulas particulares ministradas 18 horas de aula
Tarefas resolvidas 10 tarefas resolvidas
Identidade verificada
  • CPF verificado
  • E-mail verificado
1ª hora grátis
JavaScript - DOM JavaScript - SELENIUM JavaScript - git
Especialização: Santander Coders - Formação Fullstack Java e Angular (Ada Tech - Lets Code)
Professor olimpico de programação, robótica e matemática. Desenvolva sua paixão pelo estudo e alcance objetivos extraordinários.
R$ 70 / h
Vinícius B.
Santo André / SP
Vinícius B.
5,0 (13 avaliações)
Horas de aulas particulares ministradas 21 horas de aula
Tarefas resolvidas 5 tarefas resolvidas
Identidade verificada
  • CPF verificado
  • E-mail verificado
1ª hora grátis
JavaScript Básico JavaScript - Back-End JavaScript - Estrutura Condicional e operadores lógicos. Expressões lógicas.
MBA: Business Intelligence (Faculdade Descomplica)
Te ensino a programar. Professor de programação, com 5 anos de atuação em .net, sql, entity framework, scrum etc.
R$ 50 / h
Gustavo A.
Campina Grande / PB
Gustavo A.
5,0 (2 avaliações)
Horas de aulas particulares ministradas 7 horas de aula
Identidade verificada
  • CPF verificado
  • E-mail verificado
1ª hora grátis
JavaScript - Estrutura Condicional e operadores lógicos. Expressões lógicas. Javascript Geral JavaScript Básico
Graduação: Engenharia da Computação (IFPB - Campus Campina Grande )
Desenvolvedor web python e javascript. Acompanhamento particular em python, html,css e javascript