How to detect `delete` and `.` when user press the keyboard on Chrome?
Solution 1
I've forced the same behavior as Firefox, example on jsFiddle
$("textarea").keydown(function(e) {
// if the key pressed was found on the list of specialChars
if (specialChars[e.keyCode])
{
// triggers the fake event
$("textarea").trigger("chromekeypress", e);
// temporary avoid keypress from firing
$("textarea").unbind("keypress");
setTimeout(function(){ $("textarea").bind("keypress", handleKey); },10);
}
});
$("textarea").keypress(handleKey); // main event
$("textarea").bind("chromekeypress", chromeKeyPress); // chrome workaround
function chromeKeyPress(i,e){
e.type="chromekeypress";
e.which = 0; // copy Firefox behavior, which == 0 means a special key pressed
handleKey(e); // fires the main event
}
function handleKey(e) {
// which is going to be 0 if it is a special key
// and keycode will have the code of the special key
// or
// which will have the value of the key
$("#r").html($("#r").html() + "\n" +
e.type + "\n" +
" which: " + e.which + " == " + String.fromCharCode(e.which) + "\n" +
" keyCode: " + e.keyCode + " == " + String.fromCharCode(e.keyCode) + "\n" +
"");
}
Solution 2
I think the best solution would be to map the keys you want (demo), then use e.which
to cross-reference what key was pressed. There is a good reference of cross-browser keyCode
values, which work in this case because jQuery normalizes the e.which
value.
var keys = {
46 : 'del',
190 : '.'
};
$("textarea").bind('keyup', function(e){
$('#r').append( 'keyup (' + e.which + '): ' + (keys[e.which] || String.fromCharCode(e.which)) );
});
This is similar to the method that jQuery UI uses - see the keycodes cross-reference at the top of the file? And it is also the method I use in the keycaster plugin.
Solution 3
In fact it's strange but it is logic.
The function String.fromCharCode is working with real char code, not with KB actions (left, delete...)
Why don't filter by keyCode simply ?
BrunoLM
I'm a Developer for Fun! Things I like Code Play games Anime / Manga Contact information [email protected] LinkedIn Facebook Site - https://brunolm.github.io/ Blog - http://blog.codingwise.com/
Updated on June 04, 2022Comments
-
BrunoLM almost 2 years
When I press
.
it fires the three events,keydown
,keypress
andkeyup
.keydown which: 190 == ¾ keyCode: 190 == ¾ keypress which: 46 == . keyCode: 46 == . keyup which: 190 == ¾ keyCode: 190 == ¾
When I press
delete
it fires two events,keydown
andkeyup
.keydown which: 46 == . keyCode: 46 == . keyup which: 46 == . keyCode: 46 == .
I want to press
.
and be able to get the corresponding character (46 == .
). But onkeydown
andkeyup
I get190
which is¾
. On thekeypress
I get the correct value, but this event is not fired when I pressdelete
.When I press
delete
I get the code46
onkeydown
andkeyup
. But the code46
is a.
and notdelete
.How can I make an event to capture both keys and tell the difference, if it was a
.
pressed ordelete
key?Page to test: http://jsfiddle.net/Eg9F3/