Key Event Handling
Key Event Handling
Folk,
I'm using JQuery 1.3.2 with a RaphaelJS application to produce a
graphical drag/drop
diagram drawing tool. See my Raphalle project on github for the D&D
library.
I have issues with the fact that on an VML text object, jQuery's
registration of mouse
event handlers doesn't work, whereas Raphael's does. Some difference
in the way
the event gets registered? Strangely, the jQuery registration works
for the other VML
objects used by Raphael. But that's not the main thing I'm writing
about, since a
simple conditional solves it.
I needed decent text event handling for my text edit widget using
Raphael's SVG or
VML text objects. By decent I mean that for any key yielding printable
text, I need
the string, and for any other key, I need the keycode - and I need the
two to *not*
be mixed up. I also need to ensure that any necessary default
behaviour is
preserved, and any overridable default behaviour can be over-ridden.
The browser differences are as listed here: <http://unixpapa.com/js/key.html
>. It's a
total dog's breakfast, and jQuery in trying to fix it, actually makes
it *worse*. For
example, in Opera, it's impossible to distinguish a left-arrow key
from a single-quote
without reference to the originalEvent (which has which=0 for the
arrow, unlike the
"fixed" event).
Some of the mess is unavoidable (for example Opera sets metaKey
instead of
ctrlKey), but in case you think I'm making this problem out to be
bigger than it
really is, first take a look at the attached code and see if you can
simplify it without
losing anything.
There appears to be no attempt yet to use Safari/Chrome's textInput
event type,
and I don't know enough jQuery to know how to bind that. You'll see I
have a
placeholder in the attached code to insert it.
Meantime... comments please?
Clifford Heath, Data Constellation, http://dataconstellation.com
Agile Information Management and Design.