我正在制作一个小文字游戏,我需要获取用户在键盘上输入的最后一个字符。我想到了两种方法来做到这一点。
第一个是通过监听文档键盘事件并通过键码获取它来获取每个字符。在我开始使用键盘死键(如 Ā)编写字符之前,它工作得很好。 String.fromCharCode(e.keyCode) 将其转换为 A,因为 keyCode 适用于 A,但事件中似乎没有关于事件产生的死键或真实字符的任何信息。
第二个是让隐藏的输入始终保持焦点(不好)并在键盘事件上获取输入值的最后一个字符,但这只有在我写得很慢的情况下才有效。我的代码如下所示:
function is_char(e){
return (!e.ctrlKey && !e.altKey && !e.metaKey &&
(e.keyCode >= 65 && e.keyCode <= 90) ||
(e.keyCode >= 97 && e.keyCode <= 122)
);
}
$('#fake_input').on('keyup', function(e){
if (is_char(e)){
$('#result').append(this.value[this.value.length - 1]);
}
}).focus();
这是工作示例 - http://jsfiddle.net/YkaBm/1/ - 你应该在输入下面得到相同的词,但是当你写得快一点时,结果是错误的。
对于如何在键盘事件中获取真实(正确)字符或者为什么输入 keyup 事件会这样,您有什么建议吗?
更新!
正如我在评论中提到的,semir.babajic 的答案对我的情况不太适用,但感谢 Semir,我发现这个愚蠢的解决方案有效:
function is_char(e){
return (!e.ctrlKey && !e.altKey && !e.metaKey &&
(e.keyCode >= 65 && e.keyCode <= 90) ||
(e.keyCode >= 97 && e.keyCode <= 122)
);
}
var x = 0;
$('#fake_input').on('keyup', function(e){
if (e.keyCode === 8){
x--;
}
else if (is_char(e)){
x++;
$('#result').append(this.value[x-1]);
}
}).focus();
我仍然很想找到一种方法来使用任何 $(document) 键盘事件从键盘事件中获取真实字符,因为保持输入集中似乎不是一个好的解决方案。
更新 2!
以防万一其他人遇到类似问题,我发现这个解决方案是最好的:
App.insert_char = function(c){
if (c && c.toUpperCase() != c.toLowerCase()){
console.log(c);
}
};
if ('oninput' in $('#fake_input')[0]){
$('#fake_input').on('input', function(e){
App.insert_char(this.value[this.value.length - 1]);
});
}
else if ('onpropertychange' in $('#fake_input')[0]){
$('#fake_input').on('propertychange', function(e){
App.insert_char(this.value[this.value.length - 1]);
});
}
else if ('ontextInput' in $('#fake_input')[0]){
$('#fake_input').on('textInput', function(e){
App.insert_char(this.value[this.value.length - 1]);
});
}
最佳答案
这一行导致了“瓶颈”:this.value[this.value.length - 1]
,速度很慢。
试试这个:
更新:
$('#fake_input').keypress(function(e){
$('#result').append(String.fromCharCode(e.which) + '<br />');
}).focus();
解释。我假设您想要使用 keypress
而不是 keyup
来捕获字符。请注意,keyup 与字符无关。它只告诉你它收到的键盘信号的键码。使用 keypress
,您可以确定大小写,因为您获得了字符的键码。
问候。
关于javascript - 在键盘事件中获取正确的字符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14253977/