0

como estan? necesito su ayuda para resolver un pequeño problema quizas parezca tonto pero estoy empezando y bueno no encuentro solución. El problema esta en que cuando hago la multiplicacion me manda NaN y no me da el resultado. Se que NaN significa que no es un número, pero me manda eso aun asi ingrese numeros en el input. Agradecería que sea hecho unicamente con Javascript. Muchas gracias!!

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script src="multx.js"></script>
    <table border="1">
      <tr>
        <td>
          <input type="text" name="valor1" />
        </td>

        <td>
          <input type="text" name="valor2" />
        </td>

        <td>
          <input type="text" name="result" readonly />
        </td>
      </tr>
    </table>
    <div>
      <input type="button" class="btn btn" value="Calcular"  onclick="Calcular()"/>
    </div>
  </body>
</html>
function Calcular() {
  let valor1 = parseFloat(document.getElementsByName("num1"));
  let valor2 = parseFloat(document.getElementsByName("num2"));

  let resultado = valor1 * valor2

  document.getElementsByName("result")[0].value = resultado;

}

4
  • 1
    Por que en ningún momento accedes a la propiedad value de los 2 inputs, realiza eso por ejemplo donde los pasas por el método parseFloat
    – user128299
    Commented el 19 nov. 2020 a las 18:58
  • 1
    En vez de getElementsByName("num1") debe ser getElementsByName("valor1"), lo mismo para el otro Commented el 19 nov. 2020 a las 19:00
  • gracias por los dos comentarios, ya cambie el nombre que tenia mal puesto en el getelementsbyname ("valor1"), y aun asi me manda el NaN. Commented el 19 nov. 2020 a las 19:10
  • tambien intente hacer lo que @BetaM me recomendo de oinerle el .value despues de los parseFloat y no me funciona aun Commented el 19 nov. 2020 a las 19:11

1 respuesta 1

1

Tu problema es que estas usando getElementsByName() lo siguiente devuelve una lista de NODOS del documento supongamos que tuvieras varios inputs con nombre "valor1" entonces getElementsByName('valor1') va devolver la cantidad de nodos que existan, si tuvieras dos en el documento, te va dar dos NODOS, luego tu debes recorrer esos nodos y verificar de cual de ellos quieres recuperar el atributo value, en tu caso como solo tienes un NODO input con el nombre "valor1" y "valor2" es suficiente que recuperes el elemento en la posición 0 [0] de la siguiente manera:

function Calcular() {
  // con [0] obtenemos el NODO en al posición 0, luego recuperamos su atributo value.
  let valor1 = parseFloat(document.getElementsByName('valor1')[0].value);
  let valor2 = parseFloat(document.getElementsByName('valor2')[0].value);

  let resultado = valor1 * valor2;

  document.getElementsByName('result')[0].value = resultado;

}

Espero esto te ayude.

2
  • Muchisimas gracias @Diego-1743 si me funciono. gracias por la explicacion tambien muy buena. y bueno ya que mencionas que cuando uso getelementsbyname me busca todos los nodos de ese getelementby name , entonces puedo hacer una tabla en la que me busque todos los valores dentro de celdas con el mismo name y multiplicarlas y sumarlas? Commented el 19 nov. 2020 a las 19:47
  • Sí!, solo pon el mismo nombre a los nodos, luego obtén la lista de nodos con getelementsbyname() con un for each recorres el array y de cada uno obtienes el atributo value, finalmente multiplicas poco a poco en una variable y luego la imprimes, no olvides agregar una validación en donde si lo ingresado no es un número pues el usuario deba corregir.
    – Diego-1743
    Commented el 19 nov. 2020 a las 20:17

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.