can i get the keycode value?

Question

can i get the keycode value?, not the code.
i mean when you push "D" key on keyboard it will return 68, can it return "D" ? and i got nothing for shift key or tab key.
it is possible to do?

(function(){
let this_, keycode_;

$('textarea')
.on('keydown', function(e){
  this_ = e.target;
  keycode_  = e.keyCode || e.which;
})
.on('input', function(){
  $('#log').text( keycode_ ); 
})
.on('keyup', function(){

});

})();

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!--
i want to get keycode_ value, not the code.
i mean when you push "D" key on keyboard it will return 68, can it return "D" ? and i got nothing for shift key or tab. 
can you solve this? 
-->
<textarea></textarea>

<div id="log"></div>

Does this answer your question? [Get Character value from KeyCode in JavaScript... then trim](https://stackoverflow.com/questions/1772179/get-character-value-from-keycode-in-javascript-then-trim) — blurfus, Aug 06 '21 at 21:40
yep. but i already got the real answer for this problem. see my answer down below. — Hanna Rose, Aug 07 '21 at 07:34

Spectric · Accepted Answer · 2021-08-04T20:57:35.170

Get the key property instead of the keyCode property from the event:

(function() {
  let this_, keycode_;

  $('textarea')
    .on('keydown', function(e) {
      this_ = e.target;
      keycode_ = e.keyCode == 9 ? 'Tab' : (e.shiftKey ? 'Shift' : (e.key || e.which));
      $(this).trigger('input');
    })
    .on('input', function() {
      $('#log').text(keycode_);
    })
    .on('keyup', function() {

    });

})();

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!--
i want to get keycode_ value, not the code.
i mean when you push "D" key on keyboard it will return 68, can it return "D" ? and i got nothing for shift key or tab. 
can you solve this? 
-->
<textarea></textarea>

<div id="log"></div>

As an alternative, you can also use String.fromCharCode() to convert the key code to a character:

(function() {
  let this_, keycode_;

  $('textarea')
    .on('keydown', function(e) {
      this_ = e.target;
      keycode_ = String.fromCharCode(e.keyCode || e.which);
    })
    .on('input', function() {
      $('#log').text(keycode_);
    })
    .on('keyup', function() {

    });

})();

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!--
i want to get keycode_ value, not the code.
i mean when you push "D" key on keyboard it will return 68, can it return "D" ? and i got nothing for shift key or tab. 
can you solve this? 
-->
<textarea></textarea>

<div id="log"></div>

wonderfull. can you make shift and tab key works? – Hanna Rose Aug 04 '21 at 20:51 — Hanna Rose, Aug 04 '21 at 20:51
@HannaRose No problem. Glad to help :) – Spectric Aug 04 '21 at 22:30 — Spectric, Aug 04 '21 at 22:30

Hanna Rose · Answer 2 · 2021-08-07T07:29:57.140

so this is the final answer:

(function(){
let this_, keycode_;

$('#test_in')
.on('keydown', function(e){
  keycode_  = e.keyCode || e.which;
  if( keycode_ === 9 ){
    //tab key
    e.preventDefault(); // prevent input to losing focus, this will Cancel the default action
  }
  $('#log').text( e.key ); 
});

})();

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!--
i want to get keycode_ value, not the code.
i mean when you push "D" key on keyboard it will return 68, can it return "D" ? and i got nothing for shift key or tab. 
can you solve this? 
-->
<textarea id="test_in"></textarea>

<div id="log"></div>

can i get the keycode value?

2 Answers2