<style>
.register {
width: 161px;
position: relative;
}
input {
outline: none;
border: 0;
border-bottom: 1px solid #ccc;
}
label img {
width: 15px;
position: absolute;
right: 4px;
top: 4px;
}
</style>
</head>
<body>
<div class="register">
<label for="">
<img src="./img/不显示密码.png" alt="" id="see">
</label>
<input type="password" name="" id="psw">
</div>
</body>
<script>
var images = document.getElementById('see');
var password = document.getElementById('psw');
var flag = 0;
images.onclick = function() {
if (flag == 0) {
password.type = 'text';
flag = 1;
images.src = "./img/显示.png";
} else {
password.type = 'password';
flag = 0;
images.src = "./img/不显示密码.png";
}
}
</script>
<!-- //核心算法：利用一个flag变量，来判断flag的值，如果是1就切换文本框，flag设置为0，如果是0就切换为密码框，flag设置为1. -->
