大家好,
我有一个表单,它有一个密码字段:
<input type="password" name="password" size="30" />
当然,输入的文本将被替换为(*)。
因此,如果用户键入123
,则框中将显示***
。
到目前为止,一切都很简单,但是...
现在,我想在密码框旁边添加一个小图标,以便当用户将鼠标悬停在该图标上时,他可以看到到目前为止输入的内容。
因此,当鼠标悬停时,框将显示123
,当用户离开图标时,框将再次显示***
。
有没有办法用JavaScript做到这一点?另外,我使用的是HTML和PHP。
编辑:
它真的不需要是一个图标,它可以是一个复选框或按钮……如果它可以用CSS完成,我将非常希望知道是如何
附注:我用谷歌搜索了stackoverflow,但一无所获
发布于 2014-03-18 20:58:05
将鼠标移到文本框上时,需要通过javascript获取文本框,并将其type
更改为text
。在将其移出时,您需要将其更改回password
。在纯CSS中不可能做到这一点。
HTML:
<input type="password" name="password" id="myPassword" size="30" />
<img src="theicon" onmouseover="mouseoverPass();" onmouseout="mouseoutPass();" />
JS:
function mouseoverPass(obj) {
var obj = document.getElementById('myPassword');
obj.type = "text";
}
function mouseoutPass(obj) {
var obj = document.getElementById('myPassword');
obj.type = "password";
}
发布于 2014-03-18 21:09:20
正如这些人所说,只要改变输入类型即可。
但是也不要忘了把类型改回来。
请看我的简单的jquery演示:http://jsfiddle.net/kPJbU/1/
HTML:
<input name="password" class="password" type="password" />
<div class="icon">icon</div>
jQuery:
$('.icon').hover(function () {
$('.password').attr('type', 'text');
}, function () {
$('.password').attr('type', 'password');
});
发布于 2016-12-09 15:12:46
我使用这一行代码,它应该能做到这一点:
<input type="password"
onmousedown="this.type='text'"
onmouseup="this.type='password'"
onmousemove="this.type='password'">
https://stackoverflow.com/questions/22480075
复制相似问题