1

es sencillo lo que quiero lograr pero quiero saber de que formas lo harían ustedes, quiero que al escribir dentro de un input aparezca un botón y que cuando el input este vacío pues desaparezca

<input type="password" placeholder="Contraseña"> <button>mostrar</button>

la verdad es que tengo que aplicarlo para angular pero aun así de cualquier forma que lo puedan hacer me sirve saberlo ya sea con typescript o javascript, gracias de antemano

2
  • 1
    Qué has intentado? Qué palabras usaste en google? Ya llevas ocho meses en el sitio, y al menos cuatro preguntas. Ya sabes que debes escribir el código que has intentado.
    – Arriel
    Commented el 18 ago. 2022 a las 14:33
  • Recuerda que tu pregunta no debe parecer un ticket para desarrollo. Muestra un ejemplo mínimo verificable de lo que has intentado hasta el momento, y el problema específico que has tenido. No coloques cualquier código en la pregunta porque sí.
    – padaleiana
    Commented el 18 ago. 2022 a las 15:02

2 respuestas 2

0

Si, es sencillo. En primera instancia requieres validar que exista el valor del input, eso lo hacemos de la siguiente forma:

<input type="password" name="inputvalor" id="inputvalor" placeholder="Contraseña">
<button type="button" id="buttonvalor" style="display:none;">mostrar</button>

En javascript, escribes lo siguiente:

input=document.getElementById('inputvalor').value;
boton=document.getElementById('buttonvalor');
if(input.length > 0){
 button.style.display = 'inline'
}else{
 button.style.display = 'none'
}

Primero, recibimos el valor del input con la variable input. Luego, recibimos la etiqueta del botón. Validamos si el input tiene algo, si es así, muestra el botón, si no es así, oculta el botón..

2
  • 1
    Evita responder a preguntas en donde el autor de la misma no haya expuesto sus intentos en resolver su planteamiento. Lee Cómo responder, en especial la sección contesta preguntas bien formadas.
    – padaleiana
    Commented el 18 ago. 2022 a las 15:00
  • muchas gracias, las dos formas me ayudaron a aprender algo nuevo y las dos formas me pueden funcionar, :D
    – Kali Linux
    Commented el 18 ago. 2022 a las 16:29
0

Espero que esto te sirva:

<body>
    <input type="text" name="name"  class="input" > 
    <button type="submit" name="submit" value="submit" class="button" hidden disabled>Submit</button>
    <script type="text/javascript">
        var input = document.querySelector('input');
        var button = document.querySelector('button');
input.onclick = function() {
  button.disabled = false;
  button.hidden = false;
}
</script>
2
  • 1
    Evita responder a preguntas en donde el autor de la misma no haya expuesto sus intentos en resolver su planteamiento. Lee Cómo responder, en especial la sección contesta preguntas bien formadas.
    – padaleiana
    Commented el 18 ago. 2022 a las 15:00
  • @padaleiana me parece correcto, pero sabia la respuesta y creía que podía ayudar Commented el 18 ago. 2022 a las 17:54

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.