How to get acess to event in keyup through keypress

问题: The question seems weird but let me tell you the story: As you might know e.keycode gained from keyup differs from e.keyCode in keypress specially when its about bilingua...

问题:

The question seems weird but let me tell you the story:

As you might know e.keycode gained from keyup differs from e.keyCode in keypress specially when its about bilingual cases.

For instance when the keyboard language is Persian and I press A, e.keyCode on key press returns 1588 while e.keyCode on keyup returns 65.

I need to get access to e.keycode offered by keyup when I'm handling keypress, I used data(), but there is a delay to value be set, something like following:

$("#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);
});

I get undefined for keycodeOnKeyup at the first time and the next time I get keycode generated from one step before.

You might suggest to use setTimeout() for keypress but it doesn't sound good, can't I send it as a parameter?

would you suggest me a method to get access to it?

Update: Thanks to @Amadan, that was easier that what I thought, I should have used keydown instead of 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);
});

回答1:

As you might read keyCode property is deprecated, to overcome this you can use "key" property:

eventObject.key.charCodeAt(0)

So your code might be like

$("#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);
});

回答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("Eventt" +event.which + "tkeyCodet" + 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>

  • 发表于 2018-12-28 19:16
  • 阅读 ( 254 )
  • 分类:网络文章

条评论

请先 登录 后评论
不写代码的码农
小编

篇文章

作家榜 »

  1. 小编 文章
返回顶部
部分文章转自于网络,若有侵权请联系我们删除