Advanced Search

Switch textfield with a password field (on focus)

/ Published in: jQuery
Save to your folder(s)
Originally form http://www.electrictoolbox.com\r\nComes in handy if you want to display a message in the field (\\\"type your password\\\") but mask the password itself.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. //src: http://www.electrictoolbox.com/jquery-toggle-between-password-text-field/
  2.  
  3. $(document).ready(function () {
  4.   $('#password-clear').show();
  5.   $('#password-password').hide();
  6.  
  7.   $('#password-clear').focus(function() {
  8.     $('#password-clear').hide();
  9.     $('#password-password').show();
  10.     $('#password-password').focus();
  11.   });
  12.   $('#password-password').blur(function() {
  13.     if($('#password-password').val() == '') {
  14.       $('#password-clear').show();
  15.       $('#password-password').hide();
  16.     }
  17.   });
  18. });
  19.  
  20. ---
  21.  
  22. #password-clear {
  23.     display: none;
  24. }
  25.  
  26. ----
  27.  
  28. <input id="password-clear" class="form-text default-value" type="text" value="Type your password" autocomplete="off" />
  29. <input id="password-password" class="form-text default-value" type="password" name="password" value="" autocomplete="off" />

URL: http://www.medilab.be/

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.