How can I give keyboard focus to a DIV and attach keyboard event handlers to it?

Paul's answer works fine, but you could also use contentEditable, like this...

document.getElementById('inner').contentEditable=true;
document.getElementById('inner').focus();

Might be preferable in some cases.

Sorted - I added tabindex attribute to the target DIV, which causes it to pick up keyboard events, for example

<div id="inner" tabindex="0">
    this div can now have focus and receive keyboard events
</div>

Information gleaned from http://www.w3.org/WAI/GL/WCAG20/WD-WCAG20-TECHS/SCR29.html

Related