javascript - 假输入文本 JavaScript

Question

我有 2 个 HTML 输入字段：

<input type="password" maxlength="4" id="fakepassword" />
<input type="hidden" maxlength="8" id="password" /> 

如何在密码字段中插入一个值，输入时以及焦点在 fakepassword 上时？
我正在尝试使用 OnkeyUp 事件从 fakepassword 中获取值，但我被困在 maxlength 上。
有没有办法从键盘按下中获取价值？

我真正的问题是，我有一个登录表单，我希望我的密码字段只显示 4 个字符，无论我输入多少字符。

请帮忙。

Answer 1

您可以在 jquery 中捕获事件：

$('#fakepassword').on('keyup', function(e){
    console.log(String.fromCharCode(e.keyCode)); //this logs the letter to the console.
});

Answer 2

你想要这个只用于 UI 吗？所以作为安全预防措施，用户不会看到他们密码的实际长度？您可以将图像放在密码字段的顶部，然后将点击通过它传递到实际的密码字段。

<div id="pass_div">
    <input type="password" name="pass" id="pass" />
    <img id="pass_img" src="" />
</div>

这#pass_img将涵盖实际的密码输入，有点“隐藏”它。我找到的图像仅用于演示目的。请找到或做一个更好的。

http://jsfiddle.net/4ssWe/

<div id="pass_div">
    <input type="password" name="pass" id="pass" />
    <img id="pass_img" src="http://i.imgur.com/1JthtLK.gif" />
</div>

#pass_div {
    position: relative;
    display: inline-block;
}
#pass_img {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    height: 100%;
    width: 100%;
    pointer-events: none;
}