Question

这个问题看起来很奇怪，但是让我告诉你这个故事：

如您所知，从e.keycode获得的keyup与e.keyCode中的keypress有所不同，特别是在涉及双语情况时。

例如，当键盘语言为波斯语并且我按A时，按键上的e.keyCode返回1588，而键盘上的e.keyCode返回65。

在处理按键时，我需要访问keyup提供的e.keycode，我使用了data（），但是设置值存在延迟，如下所示：

$("#textBox").on("keyup", function(e){
   var keycode = e.keyCode;
   $(this).data('code-on-keyup', keycode);
}) 

$("#textBox").on("keypress", function(e){
   var keycodeOnKeypress = e.keyCode,
       keycodeOnKeyup = $(this).data('code-on-keyup');
   console.log(keycodeOnKeypress, keycodeOnKeyup);
});

我第一次和下一次获得从前一个步骤生成的密钥代码时，都会得到undefined的keycodeOnKeyup。

您可能会建议使用setTimeout()进行按键操作，但听起来不太好，我不能将其作为参数发送吗？

您会建议我一种访问它的方法吗？

更新：感谢@Amadan，这比我想的要容易得多，我应该使用keydown而不是keyup：

$("#textBox").on("keydown", function(e){
   var keycode = e.keyCode;
   $(this).data('code-on-keydown', keycode);
}) 

$("#textBox").on("keypress", function(e){
   var keycodeOnKeypress = e.keyCode,
       keycodeOnKeydown = $(this).data('code-on-keydown');
   console.log(keycodeOnKeypress, keycodeOnKeydown);
});

Answer 1

您可能会看到keyCode属性已过时，为了克服这个问题，您可以使用“键”属性：

eventObject.key.charCodeAt(0)

所以您的代码可能类似于

$("#textBox").on("keyup", function(e){
   var keycode = e.originalEvent.key.charCodeAt(0);
   $(this).data('code-on-keyup', keycode);
})

$("#textBox").on("keypress", function(e){
   var keycodeOnKeypress = e.originalEvent.key.charCodeAt(0),
       keycodeOnKeyup = $(this).data('code-on-keyup');
   console.log(keycodeOnKeypress, keycodeOnKeyup);
});

Answer 2

$( document ).ready(function() {

    var theText = $("#theText");
    var theOutputText = ("#theOutputText");
    var theOutputKeyPress = ("#theOutputKeyPress");
    var theOutputKeyDown = ("#theOutputKeyDown");
    var theOutputKeyUp = ("#theOutputKeyUp");
    var theOutputFocusOut = ("#theOutputFocusOut");

    

    theText.keypress(function (event) {
      console.log('keypress');
     keyReport(event, theOutputKeyPress);
      theText.keyup(function (event) {
console.log('keyup');
      keyReport(event, theOutputKeyUp);
    });
    });


   

  

 

    function keyReport(event, output) {
        // catch enter key = submit (Safari on iPhone=10)
        if (event.which == 10 || event.which == 13) {
            event.preventDefault();
        }
        // show event.which
      console.log("Event\t" +event.which + "\tkeyCode\t" + event.keyCode);
        // report invisible keys  
        switch (event.which) {
            case 0:
                output.append("event.which not sure");
                break;
            case 13:
                output.append(" Enter");
                break;
            case 27:
                output.append(" Escape");
                break;
            case 35:
                output.append(" End");
                break;
            case 36:
                output.append(" Home");
                break;
        }
        // show field content
       console.log(theText.val());
    }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<form>
    <fieldset>
        <label for="theText">Enter some text</label>
        <input id="theText" type="text" />
    </fieldset>
</form>

如何通过按键来获取按键事件

2 个答案: