我怎样才能给DIV键盘焦点和键盘事件处理程序呢？
我正在构build一个应用程序，我希望能够单击由DIV表示的矩形，然后使用键盘通过列出键盘事件来移动该DIV。
可以在DIV级别监听键盘事件，而不是在文档级别对这些键盘事件使用事件监听器，也许可以通过键盘焦点来监听？
这里有一个简单的例子来说明这个问题：
<html> <head> </head> <body> <div id="outer" style="background-color:#eeeeee;padding:10px"> outer <div id="inner" style="background-color:#bbbbbb;width:50%;margin:10px;padding:10px;"> want to be able to focus this element and pick up keypresses </div> </div> <script language="Javascript"> function onClick() { document.getElementById('inner').innerHTML="clicked"; document.getElementById('inner').focus(); } //this handler is never called function onKeypressDiv() { document.getElementById('inner').innerHTML="keypress on div"; } function onKeypressDoc() { document.getElementById('inner').innerHTML="keypress on doc"; } //install event handlers document.getElementById('inner').addEventListener("click", onClick, false); document.getElementById('inner').addEventListener("keypress", onKeypressDiv, false); document.addEventListener("keypress", onKeypressDoc, false); </script> </body> </html> 在单击内部的DIV时，我试着给它指定焦点，但随后的键盘事件总是在文档级别拾取，而不是我的DIV级别事件侦听器。
我是否只需要实现特定于应用程序的键盘焦点概念？
我应该添加我只需要这个在Firefox中工作。
sorting – 例如，我添加了tabindex属性到目标DIV，这导致它拿起键盘事件
<div id="inner" tabindex="0"> this div can now have focus and recieve keyboard events </div>
从http://www.w3.org/WAI/GL/WCAG20/WD-WCAG20-TECHS/SCR29.html收集的信息;
保罗的答案工作正常，但你也可以使用contentEditable，像这样…
document.getElementById('inner').contentEditable=true; document.getElementById('inner').focus();
在某些情况下可能会更好。
