如何键盘下或间拉"选择"?

Question

我有一个定制的ajax[div]基于动态的下拉菜单。

我有一个输入]框其中； onkeyup, 运行一个阿贾克斯搜索其返回的结果 divs和被抽回在使用 innerHTML.这些 div所有有亮点 onmouseover 因此，一个典型的成功的搜索可得到以下结构(原谅半代码):

[input]
 [div id=results] //this gets overwritten contantly by my AJAX function
  [div id=result1 onmouseover=highlight onclick=input.value=result1]
  [div id=result2 onmouseover=highlight onclick=input.value=result2]
  [div id=result2 onmouseover=highlight onclick=input.value=result2]
 [/div]

它的工作。

然而，我失去了重要职能后面的规则HTML要素。我不能键盘向下或向上之间的"选项"。

我知道javascript处理键盘的事件，但;我还没有能够找到一个很好的指导。(当然，后续问题将是：我可以使用 <ENTER> 要触发器 onclick 事件吗？)

Answer 1

什么你需要做的就是附加事件的听众来的 div 与 id="results".你可以做这个加入 onkeyup, onkeydown, 等等。属性 div 创建它时或者你可以将这些使用JavaScript。

我建议您使用的AJAX库喜欢 衣, jQuery, 原型, 等等。原因有两个：

1. 听起来像你在努力创造一个 自完成 控制其中一些是大多数阿贾克斯的方法应该提供。如果你可以使用的现有成分你会节省很多时间。
2. 甚至如果你不想使用的控制提供一个图书馆，所有的图书馆提供的事件库，帮助藏身之间的差异事件Api提供不同的浏览器。

忘记addEvent，使用雅虎的事件的效用 提供了一个良好的摘要什么样的一个事件的图书馆应当提供给你。我敢肯定该事件的图书馆提供的jQuery的原型。al。提供类似的功能。

如果这一条去过你的头看看 这个文件 第一然后再阅读原文(我发现的文章作出更多的意义之后我会使用的活动图书馆)。

一些其他的东西:

• 使用JavaScript给你更多的控制比写 onkeyup 等等。属性为你HTML。除非你想要做的事 真的很简单 我会用JavaScript。
• 如果你自己写的代码来处理活动键盘 好钥匙密码参考 是真的派上用场。

Answer 2

关掉我的头顶，我会认为你会需要保持某种形式的数据结构中的JavaScript反映项目目前拉的名单。你还需要参考以前的活动/选择的项目。

每个时间 keyup 或 keydown 被解雇，更新基准的活动/选择的项目在数据结构。提供的突出的信息在用户界面，添加或删除某一类名称的风格通过CSS基础上，如果项目活动/选择或没有。

此外，这不是一番，但是 innerHTML 不是真正的标准(看看 createTextNode(), createElement(), ， appendChild() 对标准的方式创造数据)。你也可以想见有关附加事件的处理程序的JavaScript，而不是这样做在一个HTML属性。