仿京东显示密码

最新推荐文章于 2024-11-18 14:11:03 发布

hellohello777

最新推荐文章于 2024-11-18 14:11:03 发布

阅读量206

点赞数 1

文章标签： javascript

本文链接：https://blog.csdn.net/m0_63680738/article/details/127708182

版权

1.点击眼睛按钮，把密码框类型改为文本框，可以看见里面的密码；

2.一个按钮两个状态，点击一次，切换为文本框，继续点击一次切换为密码框；

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <input type="password" id="pwd">//设置文本框
    <script>
        var pwd=document.getElementById('pwd');//获取事件
        var flag=0;
        eye.onclick=function()
        {
            if(flag==0)
            {
             pwd.type='text';
             flag=1;//点击一次flag改变一次
            }
            else{
                pwd.type='password';
                flag=0;
            }
        }
    </script>
</body>
</html>