11

我正在制作一个小文字游戏，我需要在其中获取用户在键盘上输入的最后一个字符。我想出了两种方法来做到这一点。

第一个是通过监听文档键盘事件并通过键码获取每个字符。在我开始使用键盘死键（如 Ā）编写字符之前，它工作得非常好。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/ - 您应该在输入下方得到相同的单词，但是当您写得快一点时，结果是错误的。

您是否有一些建议如何在键盘事件中获取真实（正确）字符，或者为什么 input 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]);
    });
}
4

1 回答 1

8

这条线导致了一个“瓶颈”：this.value[this.value.length - 1]它只是很慢。

试试这个：

更新：

$('#fake_input').keypress(function(e){
    $('#result').append(String.fromCharCode(e.which) + '<br />');
}).focus();

解释。我假设您想使用keypress而不是keyup捕获字符。请注意，keyup 与字符无关。它只告诉你它收到的键盘信号的键码。使用keypress，您可以确定大小写，因为您获得了字符的键码。

http://jsfiddle.net/YkaBm/8/

问候。

于 2013-01-10T09:11:50.093 回答