html密码的显示与隐藏

html密码的显示与隐藏

眼睛睁开眼睛闭上

<p>
        <label for="mi">密&nbsp&nbsp&nbsp&nbsp&nbsp码:</label>
        <input type="password" name="密码" id="mi" placeholder="请输入密码">
        <a href="#" id="passwordeye1"><img src="images/眼睛闭上的图片.png" height="15" width="18" id="imag1"/></a>
  </p>

先放眼睛闭上的图片是因为密码框默认是看不见的

<script>
    window.addEventListener(load,function (ev) {
            
     
        let eye = window.document.getElementById(passwordeye1);
        eye.addEventListener(click,function () {
            
     
            let mi =  window.document.getElementById(mi);
            let type = mi.type;
            if (type === password){
            
     
                mi.type = text;
            }else{
            
     
                mi.type = password;
            }
            let ima = window.document.getElementById(imag1);
            if (type === password){
            
     
                ima.src="images/眼睛睁开.png";
            }else{
            
     
                ima.src="images/眼睛闭上.png";
            }
        })
    })
</script>
经验分享 程序员 微信小程序 职场和发展