Home / Questions / 81361
Accepted
Carlos Bonilla
Asked: 2020-06-25 20:01:46 +0800 CST 2020-06-25 20:01:46 +0800 CST

How to change a password type input to a text type input with a checkbox in javascript? [closed]

  • 772

My code is like this:

function hideOrShowPassword() {
  var password1, password2, check;

  password1 = document.getElementById("password1");
  password2 = document.getElementById("password2");
  check = document.getElementById("ver");

  if (check.checked == true) // Si la checkbox de mostrar contraseña está activada
  {
    password1.type = "text";
    password2.type = "text";
  } else // Si no está activada 
  {
    password1.type = "password";
    password2.type = "password";
  }
}
<script src="../validar.js"></script>

<input class="input-100" type="password" id="password1" name="password1" maxlength="39" placeholder="Ingresa tu contraseña " />
<br>
<input class="input-100" type="password" id="password2" name="password2" maxlength="39" placeholder="Verifica tu contraseña " />
<small>
    <input type="checkbox" id="ver" class="ver" onChange="hideOrShowPassword()" />
    <label class="text">Mostrar contraseña</label>
</small>

And I want that when enabling the checkbox, the one typeof the inputs is changed to text.

javascript

1 Answers

  1. Best Answer

    The code you have works:

    function hideOrShowPassword(){
  var password1,password2,check;

  password1=document.getElementById("password1");
  password2=document.getElementById("password2");
  check=document.getElementById("ver");

  if(check.checked==true) // Si la checkbox de mostrar contraseña está activada
  {
      password1.type = "text";
      password2.type = "text";
  }
  else // Si no está activada
  {
      password1.type = "password";
      password2.type = "password";
  }
}
    <input class="input-100" type="password"id="password1" name="password1" maxlength="39"  placeholder="Ingresa tu contraseña " />
<br>
<input class="input-100" type="password"id="password2" name="password2" maxlength="39"  placeholder="Verifica tu contraseña " />
<small>
    <input type="checkbox" id="ver" class="ver" onChange="hideOrShowPassword()" />
    <label class="text">Mostrar contraseña</label>
</small>

    • 0