input输入密码时隐藏和显示的切换

自己琢磨的一点思路 很简单常见的需求，先看效果：

眼睛是两张图片可以直接切下来使用；

先看html代码:

<input type="password" class="secret">
<span class="eyes">
    <img class="secreteyes" src="/static/images/eyes.png" alt=""> //闭眼
    <img class="secreteyesk none" src="/static/images/eyesk.png" alt=""> //睁眼
</span>

css:

.secret{
    border: none;
    border-bottom: 1px solid #ccc;
    text-indent: 10px;
}
.none{
    display:none;
}

由于clcik点击一次后切换不回来，所以定义一个变量 判断数字的奇偶，当a为奇数时密码显示，为偶时密码隐藏；

	var a = 0;
	$('.eyesk').click(function(){
		a += 1;
		if(a%2 == 0){
			$('.secreteyesk').addClass('none');
			$('.secreteyes').removeClass('none');
			$('.secret').prop('type','password');
		}else if(a%2 != 0){
			$('.secreteyes').addClass('none');
			$('.secreteyesk').removeClass('none');
			$('.secret').prop('type','text');
		}
	})