使滚动键滚动正确的页面元素

Mic*_*ael 4 javascript scroll keyboard-events dom-events

我的页面中有一个可滚动的DIV,而页面上没有其他元素.(页面布局固定在DIV本身上方和下方的控件上.)我希望箭头键和页面向上/向下翻页以在所有情况下滚动DIV,但除非DIV实际上具有焦点,否则我似乎无法这样做.其他DIV中还有其他输入字段,通常具有焦点.我已经尝试在文档级捕获箭头键和页面/向上/向下'keydown'事件并直接模拟相同的事件(使用此问题的答案)到需要滚动的DIV,但不会发生滚动.我知道正在调度该事件,因为如果我附加一个事件处理程序,我会看到它,但由于某种原因它不会导致任何滚动.我也试过设置DIV的"tabIndex"属性没有区别.

如何指定特定元素来接收这样的特定键?当某些键只能对页面上的单个元素有意义时,要求特定元素专注于某些键才能工作,这对用户来说是非常不友好的.不得不经常将焦点从另一个元素切换到可滚动区域以滚动和返回以输入数据.

我已经看到了可以通过其他方式模拟滚动的建议,但我想避免使用该路由,因为这并不总是产生相同的结果,并且我还希望将其推广到除滚动之外的其他类型的关键事件和动作.

Tad*_*ták 6

您可以通过调整其scrollTop DOM属性来滚动任何元素.

如果您捕获keydown文档上的所有事件,然后根据按下的键(使用对象的which属性event)以及可能的其他情况(输入聚焦,控件检查等)决定您要采取的操作,您可以轻松滚动你的div.看看这个小提琴,进行简单的演示.