Keypress event not firing only at the beginning and end of a textbox in Firefox (JQuery)
I am listening for keypress events on a delegate input field. For some reason Firefox does not fire a delegated event for the UP cursor when it is at the beginning of a field, or the DOWN cursor when at the end. LEFT and RIGHT work as expected all the time.
Binding the event listener directly to the field works great, so it has to be delegation related. Does anyone know if this is an information problem, I haven't found anything on google / forums etc.?
$("div").delegate(":input", "keypress", function(e){
// doesn't get triggered
});
$("div :input").bind("keypress", function(e){
// gets triggered fine
});
Here is a demo that shows the problem - http://livsey.org/jquery.delegation.html
a source to share
These keys don't bubble in Firefox, at least not in this case, so .delegate()
either .live()
won't work. This is a known issue, it is better to use a different event in this case, for example keydown
or keyup
, you can see the jQuery documentation.keypress()
for a quick look:
Note that keydown and keyup provide a code indicating which key was pressed, while a keypress indicates which character was entered. For example, lowercase "a" would display as 65 with keydown and keyup, but as 97 with a key press. Uppercase "A" is reported as 65 for all events. Because of this difference, when choosing specific keystrokes like arrow keys, .keydown () or .keyup () is the best choice.
Code update for this:
$("div")().delegate(":input", "keyup", function(e){
log("delegated: "+e.keyCode);
});
$("div :input").bind("keyup", function(e){
log("bound: "+e.keyCode);
});
a source to share