js 实现 input密码框 密码的显示和隐藏功能

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/cofecode/article/details/87911729

鼠标按下时,密码铭文显示,鼠标抬起时,密码铭文不显示

blade模板
这里使用了bootstrap 的icon font

<input type="password" value="{{ old('password') }}" >
<i onmouseup="Pwdtag(this,false)" onmousedown="Pwdtag(this,true)" class="glyphicon glyphicon-eye-close"></i>

js部分

操作i标签的上一个元素prev(),也即input标签的type属性

function Pwdtag (obj,flag) {
    if (flag) {
        $(obj).removeClass('glyphicon-eye-close').addClass('glyphicon-eye-open')
        $(obj).prev().attr('type','text')
    } else {
        $(obj).removeClass('glyphicon-eye-open').addClass('glyphicon-eye-close')
        $(obj).prev().attr('type','password')
    }
}

猜你喜欢

转载自blog.csdn.net/cofecode/article/details/87911729