将键盘焦点设置为<div>

我有以下代码片段：

<div id="listbox1div" style="z-index:95; background:white; overflow-y:auto; overflow-x:hidden; width:240; height:314px;"> <a id="focusLink2"></a> <table id="ptObj_listbox1... 

我有一个dynamic构build<div>元素的页面（比如上面）。 这个<div>显示主屏幕顶部的数据。 当页面生成div我想设置焦点。 我不能把onLoad函数放在body标签上，因为我不知道什么时候会生成div。

一个<div>标签不能直接在其上设置焦点。 所以我把一个空的<a>标签与我在以下函数中调用的ID：

 function setTableFocus(count){ var flinkText = 'focusLink'+count; document.getElementById(flinkText).focus(); } 

我没有得到任何错误，我知道当页面呈现（通过警报）时正在调用该函数。 但是，当我使用箭头键或inputbutton整个页面移动（甚至不是呈现数据的div）。

当我点击一个表格元素（使用鼠标）。 之后，keydown事件开始工作。 我想要做的是将数据呈现给用户，并自动进行键盘驱动。

有没有人有任何build议，我可以做到这一点？

Answer 1

如果添加tabindex属性，则可以使div成为可聚焦的。

请参阅： http : //snook.ca/archives/accessibility_and_usability/elements_focusable_with_tabindex

tabindex值可以允许一些有趣的行为。

• 如果给定值为“-1”，则该元素不能被标签化，而是可以以编程方式将焦点赋予该元素（使用element.focus（））。
• 如果给定值0，则元素可以通过键盘聚焦并落入文档的标签stream中。
• 大于0的值将创build一个优先级别，1是最重要的。

更新：在http://jsfiddle.net/roberkules/sXj9m/添加了一个简单的演示;

Answer 2

dynamic生成div的函数将有上下文可用来了解哪个div要关注，在最后一个div输出一个带有scrollTo（）的脚本来关注所需的div。 为每个div分配一个ID，这样你就可以从中select一个ID。

 Response.Write " <script language='text/javascript'> document.getElementById('div#').scrollIntoView(); </script> " 

Answer 3

你不能集中一个分区。 你的意思是关注一个input吗？

无论如何，您可以包含一个简短的脚本标记，将重点放在HTML中 – 只需将脚本放在div之后 – 甚至放在div内。

Answer 4

你在控制aspfunction吗？ 如果是的话，那将是最容易设定焦点的地方。 否则，您可以侦听DOMNodeInserted事件（注意：浏览器支持可能会有所不同），并根据适当的条件将焦点设置为div （或其子项）。

Answer 5

你可以使用getElementsByClassName

 <div tabindex="0" class="to-focus">TEXT</div> <script> document.getElementsByClassName('to-focus')[0].focus()</script> 

Answer 6

你的意思是说你想在创builddiv的时候关注它吗？ 尝试重新研究这些

http://api.jquery.com/focus/

和

http://api.jquery.com/live/

和按键

http://api.jquery.com/keypress/

afaik divs和其他元素可以像维基中的某种types的焦点，如..

http://en.wikipedia.org/wiki/JavaScript#Cross-site_vulnerabilities

它会在那里自动滚动。 我只是不知道如何。

至于dynamic生成的div和表，你可以使用jQuery的live（）函数

Answer 7

我解决了这个问题：

 <div tabindex="0" > <button onclick="element.parentNode.focus();"/> </div>