<style>
input {
width: 300px;
height: 40px;
outline: none;
text-indent: 2em;
position: relative;
}
img {
width: 30px;
position: relative;
left: -40px;
top: 10px;
}
span{
position: absolute;
left: 10px;
top: 20px;
}
</style>
</head>
<body>
<input type="text" id="app"><span>🔒</span>
<img src="./img/eye.png" alt="">
<script>
let _app = document.querySelector('#app')
let _imgs = document.querySelector('img')
let flag = true;
_imgs.onclick = function () {
if (flag==true) {
_imgs.src = './img/lock.png'
_app.type = 'password'
flag=false;
}else{
_imgs.src = './img/eye.png'
_app.type = 'text'
flag=true
}
}
_app.onclick = function () {
_app2.style.display = 'none'
if (_wrapper.style.display == 'none') {
_wrapper.style.display = 'block'
} else {
_wrapper.style.display = 'none'
}
_input.value=''
_text.value=''
}
</script>
</body>
1120
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
