input password显示明文密码

最新推荐文章于 2024-05-13 17:57:15 发布

云烟溪雪

最新推荐文章于 2024-05-13 17:57:15 发布

阅读量1.3k

点赞数

CC 4.0 BY-SA版权

分类专栏： jquery js 文章标签： html javascript css

本文链接：https://blog.youkuaiyun.com/wxl1390/article/details/130038750

js 同时被 2 个专栏收录

24 篇文章

订阅专栏

jquery

4 篇文章

订阅专栏

这是一个使用HTML、CSS和JavaScript实现的交互式登录界面，其中包含一个文本输入框用于账号，一个密码输入框用于输入密码，并且密码输入框旁边有一个图片按钮，点击可以切换显示/隐藏密码状态。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>
	<head>
		<title></title>
		<style type="text/css">
			img {
				vertical-align:top;
				width: 25px;
			}
		</style>
	</head>
<body>
		<input type="text" placeholder="账号" />
		<br /><br />
		<input type="password" value="" placeholder="请输入密码" id="mima">
		<img src="./img/close.png" alt="" id="showText" onclick="hideShowPsw();">
	<script>
			var demoImg = document.getElementById("showText");
			var mima = document.getElementById("mima");
			function hideShowPsw() {
				if (mima.type == "password") {
					mima.type = "text";
					demoImg.src = "./img/open.png";
				} else {
					mima.type = "password";
					demoImg.src = "./img/close.png";
				}
			}
	</script>
</body>
</html>