redirect input to accelerator (accessKey)

Short version: if the user types an alt+ctrl+char combination which
leads to a defined character, but s/he's not in a input(text)/textarea,
then I'd like that keystroke combination to do the same action that it
would have done had there not been a defined character.

Longer explanation: I've got a US keyboard and a pseudo
Hungarian/German keyboard (I combined them). The extra keys on the
European keyboard are entered via alt+ctrl+char and
alt+ctrl+shift+char. Now when you define an access key in FF or IE,
the browser tends to care about alt+char being pressed. If ctrl or
shift are there, too, they can come along for the ride. However, if I
have this key combination mapped to something in the operating system,
then the mapping takes priority and the accelerator is ignored.

My question is how to get FF's "default" behaviour of trying the access
key when I'm not in a text input or textarea. The reason I think I
might have a fighting chance is that if I stick an alert('hi mom') in
the onkeydown event handler, then the element with the accelerator is
activated. I just don't know how to bypass having to use the alert.

The example below assumes that alt+ctrl+g maps onto a key which will
display in the input (with my European mapping it maps to §). If it's
not true for you, then you won't see any issues on your system (for
example, on my US keyboard mapping). In that case, one should select
another letter as the access key (go to a text area and start typing
alt+ctrl combinations till something displays), and change the 7th line
in the page below:

<html><head><title>Accesskey testing</title></head>
<body onkeydown="keyDowned(event)"
onload="document.getElementById('cb').focus()">
<form name=foo action="" method=get>
<input type=text id=txt name=txt>  
<input type=checkbox id=cb name=cb><br><br>
<button type=button id=btn accesskey=g
onclick="alert('Btn activated')">
<u>G</u>o for it</button>
</form>
<div id=log>Log:</div>
<script type='text/javascript'>
function keyDowned(evt) {
evt = evt || window.event;
document.getElementById('log').innerHTML += "[" +
evt.which + ", " + evt.keyCode + ", " + evt.charCode + "] ";
if (evt.altKey && evt.keyCode>19 && evt.target) &&
evt.target.nodeName!="TEXTAREA" &&
(evt.target.nodeName!="INPUT" ||
evt.target.type!="text")) {
// allows default handling to act?
alert('about to activate');
}
}
</script>
</body></head>

Csaba Gabor from Vienna

Csaba Gabor wrote:[color=blue]
> Short version: if the user types an alt+ctrl+char combination which
> leads to a defined character, but s/he's not in a input(text)/textarea,
> then I'd like that keystroke combination to do the same action that it
> would have done had there not been a defined character.[/color]

Phooey. Somehow an extra right parenthesis crept into the code I gave,
so I redid it to "work" in IE. Only it doesn't. When you do the
ctrl+alt+g combination, the alert does not overcome IE's reluctance on
the accessKey.

Also, in FF if you just press alt+g (outside the textbox), first the
button fires. Then the keyDowned function puts up its alert. When
you dismiss it, the button fires again. Seems mighty suspicious to me.
And that is observable on US keyboard layouts (ie. alt+g is not being
mapped to a printing character). Interestingly, this doesn't happen if
ctrl+alt+g (or its shifted cousin) is not mapped to a printing
character. In that case (using the US layout), keyDowned runs and
subsequently the button is fired.

I don't have any ideas for shoring this up at this point. Even if I
could get around the FF alert business, I have the same (or worse)
problem in IE. Right now it looks like if I want ctrl modifiers upon
click events (even when activated from outside text entry fields), I
have to use a mouse.

Csaba Gabor from Vienna

Here's the corrected page, testable in both IE and FF:
<html><head><title>Accesskey testing</title></head>
<body onkeydown="keyDowned(event)"
onload="document.getElementById('cb').focus()">
<form name=foo action="" method=get>
<input type=text id=txt name=txt>  
<input type=checkbox id=cb name=cb><br><br>
<button type=button id=btn accesskey=g
onclick="window.log.innerHTML+='BtnFired '">
<u>G</u>o for it</button>
</form>
<div id=log>Log:</div>
<script type='text/javascript'>
window.log=document.getElementById('log');
function keyDowned(evt) {
evt = evt || window.event;
var trgt = evt.target || evt.srcElement;
var log = document.getElementById('log');
log.innerHTML += "[" + evt.keyCode;
if (typeof(evt.which)=="number")
log.innerHTML += ", " + evt.which;
if (typeof(evt.charCode)=="number")
log.innerHTML += ", " + evt.charCode;
log.innerHTML += ", " + (trgt.type || trgt.nodeName) + "] ";
if (evt.altKey && evt.keyCode>19 && trgt.nodeName) {
if (trgt.nodeName!="TEXTAREA" &&
(trgt.nodeName!="INPUT" ||
trgt.type!="text")) {
// allows default handling to act?
alert('about to activate');
} }
}
</script>
</body></head>

redirect input to accelerator (accessKey)

re: redirect input to accelerator (accessKey)

Similar JavaScript / Ajax / DHTML bytes

/bytes/development

/bytes/it

/bytes/about