输入密码框内的哪个小眼睛怎么实现的啊？
qq_慕慕3093659
2021-04-09 09:22
输入密码框内的哪个小眼睛怎么实现的啊？
3回答
-
- weixin_慕勒0023820
- 2023-08-25 11:12:51
input type的属性用password就有啦
-
- 一只小白鼠i
- 2021-05-06 14:36:56
我们可以利用Font Awesome一套绝佳的图标字体库和CSS框架
下面是我的代码，你可以看一下
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>表单标签</title>
<link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet">
</head>
<body>
<form method="post" action="test2.html">
<label for="username">用户名:</label>
<input type="text" name="username" id="username" value="" />
<label for="pass">密码:</label>
<input type="password" name="pass" id="pass" value="" />
<i class="fa fa-eye" onclick="showhide()" id="eye"></i>
<input type="submit" value="确定" name="submit" />
<input type="reset" value="重置" name="reset" />
</form>
</body>
<script type="text/javascript">
var a=document.getElementById("eye");
var b=document.getElementById("pass");
function showhide(){
if(b.type=="password"){
b.type='text';
a.className='fa fa-eye-slash'
}else{
b.type='password';
a.className='fa fa-eye'
}
}
</script>
</html>
-
- jacky0382
- 2021-04-10 18:57:44
这个要结合js来控制
初识HTML(5)+CSS(3)-升级版
1225316 学习 · 18230 问题
相似问题