While filling up a form, there comes a situation where we type a password and want to see what we have typed till now. To see that, there is a checkbox clicking on which makes the characters visible.
In this post, this feature i.e. toggling password is implemented using JavaScript.
Algorithm
1)Create a HTML form which contain an input field of type password.2)Create a checkbox which will be responsible for toggling.
3)Create a function which will response for toggling when a user clicks on the checkbox.
Examples:
Password is geeksforgeeks.
So, on typing it will show like this *************
And on clicking the checkbox it will show the characters: geeksforgeeks.
<!DOCTYPE html> <html> <body> <b><p>Click on the checkbox to show or hide password: </p></b> <b>Password</b>: <input type="password" value="geeksforgeeks" id="typepass"> <input type="checkbox" onclick="Toggle()"> <b>Show Password</b> <script> // Change the type of input to password or text function Toggle() { var temp = document.getElementById("typepass"); if (temp.type === "password") { temp.type = "text"; } else { temp.type = "password"; } } </script> </body> </html> |
Output:
-
Hide password:
-
Show password:
leave a comment
0 Comments