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
    – user128299
    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/…
    – user128299
    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
    – user128299
    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

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.