Monday, June 29, 2020

Changing Attribute “type” from text to password in Jquery Textbox

Password Input Focus Event :
Password Input Blur Event :

Sample Html Page :


<html>
    <head>
        <title>Changing Attribute type from text to password</title>
        <style type="text/css">
        </style>
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
        <script type="text/javascript">
  $(document).ready(function() {
                   $("#password_input").focus(function() {    
       $("#password_input").prop('type','text'); 
                    });
                  $("#password_input").blur(function() {        
                   $("#password_input").prop('type','password');
                });
     });
        </script>
    </head>
    <body>
        <div id="loginBox">
            <form>
             username : <input type="text" id="username_input" name="username" /><br />
             password  :<input type="text" id="password_input" name="password" /> <br />
               
            </form>
        </div>
    </body>
</html>

No comments:

Post a Comment