1

lo que quiero hacer con mi código es simplemente que al introducir 2 números distintos en 1 input cada uno y darle a un botón, en otro tercer input muestre el resultado de la comparación. Al final hay otro botón que al darle se reinicie todo.

introducir la descripción de la imagen aquí

<body>
<div id="h1">
    <h1>Comparador</h1>
</div>
<div class="grid">
    <div id="number1">
        <h2>NÚMERO A</h2>
    </div>
    <div id="number2">
        <h2>NÚMERO B</h2>
    </div>
</div>
<input type="number" id="n1" value="">
<input type="number" id="n2" value="">
<div>
    <div id="b1">
        <button type="submit" onclick="numberComparation(n1, n2)">PULSA PARA COMPARAR</button>
    </div>
    <div>
        <input type="text" id="comparacion" value="Resultado">
    </div>
    <div id="b2">
        <button type="reset">REINICIAR</button>
    </div>
</div>
<script lang="JavaScript">
    var n1 = document.getElementById("n1").value
    var n2 = document.getElementById("n2").value
    function numberComparation(n1, n2) {
        if (n1 > n2) {
            var resultado = "El número A es mayor que el número B"
            document.getElementById("comparacion").value = resultado
        } else if (n1 < n2) {
            var resultado = "El número A es menor que el número B"
            document.getElementById("comparacion").value = resultado
        } else (n1 = n2) 
            var resultado = "El número A es igual que el número B"
            document.getElementById("comparacion").value = resultado
        }
</script>

Mi problema es que el input que muestra el resultado solo muestra "El número A es igual que el número B" sin importar los números que introduzca previamente. Y el botón de reiniciar no funciona.

Me parecía una tarea sencilla pero ni esto soy capaz de hacer, os agradecería que me ayudarais para poder aprender. Un saludo ; )

1
  • Un comentario, en el else ya no va una condición a evaluar, es el segmento de tu condicional que se ejecutará cuando ninguna de las otras condiciones que escribas se cumplan
    – BetaM
    el 23 jun. 2021 a las 14:21

2 respuestas 2

5

revisando tu código, un problema que he encontrado es en el else de la función numberComparation,

 else (n1 = n2) 
            var resultado = "El número A es igual que el número B"
            document.getElementById("comparacion").value = resultado
        }

Cuando haces n1 = n2 estás haciendo una asignación en vez de una comparación, Para comparar valores se hace con dos == incluso, si quieres comparar, valor y tipo de dato sería con ===. Otra error que veo es que el n1 y n2 que pasas al onclick no tienen nunca valor.

onclick="numberComparation(n1, n2)"

Te pongo la corrección al ejercicio.

<div id="h1">
  <h1>Comparador</h1>
</div>
<div class="grid">
  <div id="number1">
    <h2>NÚMERO A</h2>
  </div>
  <div id="number2">
    <h2>NÚMERO B</h2>
  </div>
</div>
<input type="number" id="n1" value="">
<input type="number" id="n2" value="">
<div>
  <div id="b1">
    <button type="submit" onclick="numberComparation()">PULSA PARA COMPARAR</button>
  </div>
  <div>
    <input type="text" id="comparacion" value="Resultado">
  </div>
  <div id="b2">
    <button type="reset">REINICIAR</button>
  </div>
</div>
<script>
  function numberComparation() {
    var n1 = +document.getElementById("n1").value
    var n2 = +document.getElementById("n2").value
    if (n1 > n2) {
      var resultado = "El número A es mayor que el número B"
      document.getElementById("comparacion").value = resultado
    } else if (n1 < n2) {
      var resultado = "El número A es menor que el número B"
      document.getElementById("comparacion").value = resultado
    } else if (n1 === n2) {
      var resultado = "El número A es igual que el número B"
      document.getElementById("comparacion").value = resultado
    }
  }
</script>

Espero que te sirva y suerte!

1
  • 4
    faltaría que n1 y n2 sean casteados a enteros o decimales, asi porejemplo: +document.getElementById("n1").value , con valores como "6" > "200" daría true y está mal. Ver esto.
    – Emeeus
    el 23 jun. 2021 a las 14:41
0

soy bastante nuevo también en el tema de la programación pero por lo que veo en tu else usas un solo signo de es igual, dentro del paréntesis, y tendría que ser de la siguiente manera else (n1 === n2) ya que, si lleva un solo signo de es igual, lo que haces es reescribir el valor de n1 para que sea igual al de n2. (Espero que esa sea la solución jajaja)

4
  • 2
    En el else ya no se evalúa alguna condición, recomiendo leas aqui: developer.mozilla.org/es/docs/Web/JavaScript/Reference/…
    – BetaM
    el 23 jun. 2021 a las 14:26
  • Se que esto no soluciona mi problema pero, entonces me recomiendas eliminar la condición del else o terminar la función con un else if?
    – Iker
    el 23 jun. 2021 a las 14:31
  • @Iker revisa el enlace que dejé, te ayudaría repasar la estructura de los condicionales
    – BetaM
    el 23 jun. 2021 a las 14:32
  • @Christian, en esta comunidad se valora mucho responder a las preguntas planteadas, sin embargo se intenta mantener la alta calidad de las respuestas y a la tuya le está faltando una explicación más detallada, o quizás un enlace a la documentación o un trozo de código (sobre todo aprovechando que el HTML/CSS/Javascript se puede probar aquí mismo en el navegador con un snippet. Para más información, te recomiendo leer Cómo responder.
    – jachguate
    el 23 jun. 2021 a las 15:18

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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