通过jquery修改input的type属性，为password时是隐藏，text则是显示。另外把眼睛的样式打开。
很多时候看着很强大的功能其实很简单
html
<div class="login-form"> ???<form class="form"> ???????<div> ???????????<i class="show_pass glyphicon glyphicon-eye-open"></i> ???????????<input type="password" class="password" placeholder="Password" value="2"> ???????????<input type="submit" class="submit btn btn-success btn-xs" value="登陆"> ???????</div> ???</form></div>jquery
<script> ???$(‘.show_pass‘).click(function () { ???????let pass_type = $(‘input.password‘).attr(‘type‘); ???????if (pass_type === ‘password‘ ){ ???????????$(‘input.password‘).attr(‘type‘, ‘text‘); ???????????$(‘.show_pass‘).removeClass(‘glyphicon-eye-open‘).addClass(‘glyphicon-eye-close‘); ???????} else { ???????????$(‘input.password‘).attr(‘type‘, ‘password‘); ???????????$(‘.show_pass‘).removeClass(‘glyphicon-eye-close‘).addClass(‘glyphicon-eye-open‘); ???????} ???})</script>test
初始效果
输入密码
查看密码
通过jquery做密码框的显示和隐藏效果
原文地址：http://blog.51cto.com/cwtea/2067166