How to create view password option typed in form

Asked

Viewed 1,306 times

1

I am creating a page to login and access the administrative area of a site. All this is being done in PHP, but I am wanting to create a stop that I saw on some sites that is the option to see the password that was typed.

I would like to know what technology is used to create this option and if possible how to create it?

  • the technology: javascript and html

  • Opá, thank you, I had found on the Web a way to do it, but it was much more complex, thank you very much. PS - I can only accept the answer in 2 min.

2 answers

1

A simple code to hide and display the password:

function mostrarSenha() {
  var tipo = document.getElementById("senha");
  if(tipo.type == "password"){
      tipo.type = "text";
  }else{
      tipo.type = "password";
  }
}
<input id="senha" type="password" value="teste">
<button onclick="mostrarSenha()">Mostrar Senha</button>

0

See if it helps you this way:

  $(document).ready(function() {
      $("#showHide").click(function() {
        if ($(".password").attr("type") == "password") {
          $(".password").attr("type", "text");

        } else {
          $(".password").attr("type", "password");
        }
      });
    });
#showHide {
      width: 15px;
      height: 15px;
      float: left;
}
#showHideLabel {
      float: left;
      padding-left: 5px;
}
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <table>
      <tr>
        <td>Password:</td>
        <td>
          <input type="password" name="password" class="password" size="25">
        </td>
      </tr>
      <tr>
        <td></td>
        <td>
          <input type="checkbox" id="showHide" />
          <label for="showHide" id="showHideLabel">Show Password</label>
        </td>
      </tr>
    </table>

  • Thanks, it also helps yes, I will train both ways.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.