是否可以通过更改一些 event
来简单地更改文本字段中写入的字符对象属性?例如,我想从命令中隐藏密码字符:
用户类型:
login username password
我想出现:
login username
********
并将密码保存到变量中。所以,我想将任意键重新映射到 *
一旦textbox.value
包含/^login [a-zA-Z0-9]+ /
。
编辑 - 尊重有关误解我的问题的评论:
因为以上所有内容都发生在一个小型命令行客户端中,并且可能有多个命令,我可能希望通过 *
来保护它们混淆,没有考虑使用 <input type="password" />
可以接受!
最佳答案
这个片段就达到了目的。它并不完美,但可以进一步开发。
window.onload = function () {
var cmdfield = document.getElementById('cmdfield'),
commandString = '',
cmds = '(login|logout)',
rex = new RegExp('^' + cmds + ' [a-zA-Z0-9]+ (\\w*)'),
keyPress = function (e) {
if ((e.which > 64 && e.which < 123) || (e.which > 47 && e.which < 58) || e.which === 32) {
commandString += String.fromCharCode(e.which);
this.value = commandString.replace(rex, function (m, a, b) {
var command = m.split(' ')[0],
param = m.split(' ')[1],
len = b.length;
if (len > 0) {
return command + ' ' + param + ' ' + new Array(len + 1).join('*');
}
if (len === 0) {
return command + ' ' + param + ' ';
}
});
}
e.preventDefault();
return;
},
keyDown = function (e) {
if (e.which === 8) {
commandString = commandString.substring(0, commandString.length - 1);
e.stopPropagation();
return;
}
if (!((e.which > 64 && e.which < 122) || (e.which > 47 && e.which < 58) || e.which === 32)) {
e.preventDefault();
}
return;
};
cmdfield.addEventListener('keydown', keyDown, false);
cmdfield.addEventListener('keypress', keyPress, false);
}
cmds
是一个以竖线分隔的所有单词列表,其后面应该有一个可见参数,在该参数之后,文本字段上将有星星,直到下一个空格。如果命令不在列表中,则第三个参数不会被混淆。
如果您想在同一行上检测此类组合的多次出现,只需使用下面的正则表达式:
rex = new RegExp('\\b' + cmd + ' [a-zA-Z0-9]+ (\\w*)', 'g'),
“命令文本”的实际值存储在commandString
中。
请注意,此实现不受鼠标或剪贴板文本编辑保护。此外,在 Firefox 上运行时,BACKSPACE 在用户再次开始写入之前不会清空该字段。
现场演示:jsFiddle .
编辑
实际上,您的问题是关于覆盖 Event
对象属性。一般来说,这些属性是只读的,不能修改。然而,该规则似乎有一个异常(exception):至少 IE9 允许在 onkeypress
处理程序中修改 window.event.keyCode
。下面的代码片段在 IE9 中调用内联 onkeypress=capitalize()
时确实有效,但不适用于 addEventListener()
附加的处理程序。
function capitalize() {
key = window.event.keyCode;
if (key > 96 && key < 123) {
window.event.keyCode = window.event.keyCode - 32;
}
return window.event.keyCode;
}
关于javascript - 更改事件输入字符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15115234/