JavaScript - Object Undefined, problema con input y las funciones

 
Vista:
sin imagen de perfil

Object Undefined, problema con input y las funciones

Publicado por Moises (1 intervención) el 12/03/2022 21:14:20
Ayuda, el código debe mostrar la suma de dos numeros en el div, sería abajo del botón.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Suma de dos numeros</title>
</head>
<body>
    <input id="input1">Ingrese el numero 1</input>
    <br>
    <input id="input2">Ingrese el numero 2</input>
    <br>
    <input type="button" onclick="operacion()">Hacer operación</input>
    <br>
    <div id="output">
        <script>
            var n1,n2,n3,text;
            n1 = parseInt(document.getElementById("input1"));
            n2 = parseInt(document.getElementById("input2"));
            function operacion(){
                n3 = n1+n2;
                text = toString(n3);
                document.getElementById("output").innerHTML = text;
            }
        </script>
    </div>
</body>
</html>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de algoritmo
Val: 37
Ha aumentado su posición en 2 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

Object Undefined, problema con input y las funciones

Publicado por algoritmo (14 intervenciones) el 12/03/2022 21:53:42
Hola

Tienes varios errores:

- document.getElementById debe acabar con .value
- La lectura de los valores de los input debe hacerse dentro de la función. Si lo dejas fuera, leerá al cargar la página, pero no lo leerá cuando llames a la función.
- El div 'output' NO PUEDE CONTENER LA FUNCIÓN, porque al asignarle a innerHTML un nuevo valor, sustituirá TODO LO QUE CONTENGA ESE DIV (incluido el javascript), por el nuevo valor.

Aquí te dejo el código.

Espero que te sirva :)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Suma de dos numeros</title>
</head>
<body>
    <input id="input1">Ingrese el numero 1</input>
    <br>
    <input id="input2">Ingrese el numero 2</input>
    <br>
    <input type="button" onclick="operacion()">Hacer operación</input>
    <br>
    <div id="output">
    </div>
    <script>
        function operacion(){
            var n1,n2,n3,text;
            n1 = parseInt(document.getElementById("input1").value);
            n2 = parseInt(document.getElementById("input2").value);
            document.getElementById("output").innerHTML = n1+n2;
        }
    </script>
</body>
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar