<!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>
效果如图: