登录页密码框加密输入不知道对错,加个小眼睛方便查看和修改,下面是小眼睛效果图,如果不喜欢这个图标可以自己去阿里图标库自己选择下载。
html代码(因为只把密码输入框展示出来了,所以样式自行调整,只给你们展示功能代码)
<div class="login_ipt"><input class="pwd" id="pwd" type="password" placeholder="请输入密码"><img class="eye" id="eye" src="./images/eye.png" alt=""></div>
js代码
// 1.获取元素var eye = document.getElementById('eye');var pwd = document.getElementById('pwd');// 2.注册事件 处理程序var flag = 0;eye.onclick = function () {// 点击一次之后,flag一定要变化if (flag == 0) {pwd.type = 'text';eye.src = './images/eye_active.png';flag = 1; //赋值操作} else {pwd.type = 'password';eye.src = './images/eye.png';flag = 0;}}