Jquery - Show hide password in Password textbox using checkbox.

By Hardik Savani | July 11, 2016 | Category : Javascript HTML jQuery

In this post we can implement how to add hide show password when user input password at register time or login time. We sometimes require to do it because that use can determine password is right or wrong.

In this example i use just jquery change event on checkbox, if check then user can see his entered password and change anything, so you can see preview and also check demo with code.



<html lang="en">


<title>Jquery - Show hide password in Password textbox using checkbox</title>

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>



<div class="container">

<h2>Jquery - Show hide password in Password textbox using checkbox</h2>

<input type="password" class="form-control my-password" name="password" />

<input type="checkbox" class="showPassword" />Show Password</div>

<script type="text/javascript">



var isChecked = $(this).prop('checked');

if (isChecked) {


} else {









Hardik Savani
My name is Hardik Savani. I'm a full-stack developer, entrepreneur and owner of Aatman Infotech. I live in India and I love to write tutorials and tips that can help to other artisan. I am a big fan of PHP, Javascript, JQuery, Laravel, Codeigniter, VueJS, AngularJS and Bootstrap from the early stage.
Follow Me: Github Twitter
***Do you want me hire for your Project Work? Then Contact US.