Habilitar/Deshabilitar Boton mediante JS

publicado por: Anonymous

Como desactivo un botón si un input de tipo texto no tiene nada y al momento de ingresarle algo. Automáticamente me habilite el botón.

HTML

 <input type="text" id="mensaje" placeholder="Mensaje" required>
    <input type="button" id="enviar" value="Enviar" disabled>

js

if(mensaje.value == ''){
    enviar.setAttribute("disabled","true");
} else {
    enviar.setAttribute("disabled","false");
}

con eso que tengo de codigo siempre esta desactivado mi boton 🙁

solución

Yo lo resolví de esta manera, también valida cuando borras en el input.

_x000D_

_x000D_

    <!DOCTYPE html>_x000D_
    <html lang="en">_x000D_
    <head>_x000D_
      <meta charset="UTF-8">_x000D_
      <meta name="viewport" content="width=, initial-scale=1.0">_x000D_
      <meta http-equiv="X-UA-Compatible" content="ie=edge">_x000D_
      <title>Document</title>_x000D_
    </head>_x000D_
    _x000D_
    <script>_x000D_
        _x000D_
        function mensajeChange() {_x000D_
          console.log("change");_x000D_
          const mensaje = document.getElementById("mensaje");_x000D_
          const boton = document.getElementById("enviar");_x000D_
          console.log(boton)_x000D_
          _x000D_
          if (mensaje.value.trim() !== "") {_x000D_
            console.log("Se muestra")_x000D_
            boton.removeAttribute('disabled')_x000D_
          } else {_x000D_
            boton.setAttribute('disabled', "true");_x000D_
          }_x000D_
        }_x000D_
        _x000D_
      </script>_x000D_
    _x000D_
    <body>_x000D_
        <input onkeyup="mensajeChange()" type="text" id="mensaje" placeholder="Mensaje" required>_x000D_
        <input type="button" id="enviar" value="Enviar" disabled>_x000D_
    _x000D_
    _x000D_
        _x000D_
    _x000D_
    </body>_x000D_
    </html>

_x000D_

_x000D_

_x000D_

Respondido por: Anonymous

Leave a Reply

Your email address will not be published. Required fields are marked *