1

actualmente estoy aprendiendo js y tengo un problema para hacer un condicional usando una entrada les dejo un ejemplo (cuando lo hago sin la entrada funciona bien) que puedo hacer alguien tendra algun ejemplo de eventos usando condicionales o loops para ayudarme, busque en youtube y no encontre respuestas muchas gracias

javascript DOM

<input id="getInto" type="text" >
<button onClick="doTask()">press</button>

<script>

    const input = document.getElementById("getInto");
    function doTask() {
 
 let age = input


if (age >= 18 ){

    alert("vote")
}
else {
    alert("does not vote");
}

}

2
  • ... Intenta let age=parseInt(input.value) y consejo para que sea mas facil intenta en vez de usar un input type text intenta usar un input type number
    – DABL03
    Commented el 20 ago. 2022 a las 23:21
  • Yo uso normalmente google para buscar este tipo de cosas.
    – DABL03
    Commented el 20 ago. 2022 a las 23:23

2 respuestas 2

0

cuando ejecutas const input = document.getElementById("getInto");, estás obteniendo el elemento HTML con el id de getInto (un input en este caso). Para obtener la información que contiene el input usas la propiedad value, que devuelve un string; en este caso, conviertes dicho string a un número para poder compararlo con otro número (usand parseInt o el operador unario +) y ya debería funcionar.

<input id="getInto" type="text" >
<button onClick="doTask()">press</button>

<script>

    const input = document.getElementById("getInto");
    function doTask() {
 
      let age = +input.value; //o parseInt(input.value)


      if (age >= 18 ){

        alert("vote")
      } else {
    alert("does not vote");
      }
}
</script>

0

<html>
    <!-- creamos un imput type number con un color de fondo blanco con un valor entre 0 y 95 -->
    <input type="number" min="0" max="95" value="0" style="background-color: white;" class="inputnumeral">
    <!-- creamos un imput type text en oculto y con un valor igual a 0 -->
    <input type="text" value="" style="display: none;"class="inputexto">
    <!-- creamos dos botones uno de color rojo y otro azul, con un texto en el medio de votar--> 

    <button class="btnrojo botones red" style="background-color:red;" disabled >Votar</button>
    <button class="btnazul botones blue"style="background-color:blue;" disabled >Votar</button>

    <script>
        //buscamos un input con una classe inputnumeral
        var inputnumeral = document.querySelector('.inputnumeral');
        //buscamos un input con una classe inputexto
        var inputexto = document.querySelector('.inputexto');
        //buscamos un boton con una classe botones
        var botones = document.querySelectorAll('.botones');
        //comprobamos cada vez qye el valor de inputnumeral cambia
        inputnumeral.onchange = function(){
            //si el valor de inputnumeral es mayor o igual que 18 y menor o igual que 65 entonces el valor de inputexto sera "PUEDES VOTAR", el color de fondo del inputnumeral sera verde, inputexto sera visible y los botones se podran pulsar
            
            if(inputnumeral.value >= 18 && inputnumeral.value <= 65){
                inputexto.value = "PUEDES VOTAR";
                inputnumeral.style.backgroundColor = "green";
                inputexto.style.display = "block";
                botones[0].disabled = false;
                botones[1].disabled = false;
            }
            //si el valor de inputnumeral es mayor que 65 y menor de 18 entonces el valor de inputexto sera "NO PUEDES VOTAR", el color de fondo del inputnumeral sera rojo, inputexto sera visible y los botones se podran pulsar
            else if(inputnumeral.value > 65 || inputnumeral.value < 18){
                inputexto.value = "NO PUEDES VOTAR";
                inputnumeral.style.backgroundColor = "red";
                inputexto.style.display = "block";
                botones[0].disabled = true;
                botones[1].disabled = true;
            }}
    
    </script>
</html>

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.