Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>In my experience <code>String.fromCharCode(e.keyCode)</code> is unreliable. <code>String.fromCharCode</code> expects unicode charcodes as an argument; <code>e.keyCode</code> returns javascript keycodes. Javascript keycodes and unicode charcodes are <em>not</em> the same thing! In particular, the numberpad keys return a different <code>keycode</code> from the ordinary number keys (since they are different keys) while the same <code>keycode</code> is returned for both <code>upper</code> and <code>lowercase</code> letters (you pressed the same key in both cases), despite them having different <code>charcodes</code>. </p> <p>For example, the ordinary number key 1 generates an event with <code>keycode</code> 49 while numberpad key 1 (with <kbd>Numlock</kbd> on) generates <code>keycode</code> 97. Used with <code>String.fromCharCode</code> we get the following:</p> <pre><code>String.fromCharCode(49) returns "1" String.fromCharCode(97) returns "a" </code></pre> <p><code>String.fromCharCode</code> expects unicode charcodes, not javascript keycodes. The key <kbd>a</kbd> generates an event with a <code>keycode</code> of 65, independentant of the case of the character it would generate (there is also a modifier for if the <kbd>Shift</kbd> key is pressed, etc. in the event). The character <kbd>a</kbd> has a unicode <code>charcode</code> of 61 while the character <kbd>A</kbd> has a <code>charcode</code> of 41 (according to, for example, <a href="http://www.utf8-chartable.de/" rel="noreferrer">http://www.utf8-chartable.de/</a>). However, those are <code>hex</code> values, converting to decimal gives us a <code>charcode</code> of 65 for "A" and 97 for "a".[1] This is consistent with what we get from <code>String.fromCharCode</code> for these values.</p> <p>My own requirement was limited to processing numbers and ordinary letters (accepting or rejecting depending on the position in the string) and letting control characters (<kbd>F</kbd>-keys, <kbd>Ctrl</kbd>-something) through. Thus I can check for the control characters, if it's not a control character I check against a range and only then do I need to get the actual character. Given I'm not worried about case (I change all letters to uppercase anyway) and have already limited the range of keycodes, I only have to worry about the numberpad keys. The following suffices for that:</p> <pre><code>String.fromCharCode((96 &lt;= key &amp;&amp; key &lt;= 105)? key-48 : key) </code></pre> <p>More generally, a function to reliably return the character from a <code>charcode</code> would be great (maybe as a jQuery plugin), but I don't have time to write it just now. Sorry.</p> <p>I'd also mention <code>e.which</code> (if you're using jQuery) which normalizes <code>e.keyCode</code> and <code>e.charCode</code>, so that you don't need to worry about what sort of key was pressed. The problem with combining it with <code>String.fromCharCode</code> remains.</p> <p>[1] I was confused for a while -. all the docs say that <code>String.fromCharCode</code> expects a unicode <code>charcode</code>, while in practice it seemed to work for ASCII charcodes, but that was I think due to the need to convert to decimal from hex, combined with the fact that ASCII charcodes and unicode decimal charcodes overlap for ordinary latin letters.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload