CSS中的tabindex

时间:2011-02-11 17:08:51

标签: html css keydown

是否可以使用CSS控制tabindex,如果是,哪些浏览器支持它以及哪些元素?

修改

我应该说,我的目标是在div上捕获keydown事件。我看到这个页面http://www.quirksmode.org/js/events/keys.html#测试键盘事件,它表明keydown触发除文档和正文以外的任何东西或某种表单元素或链接的唯一方法是在其上声明tabindex。但我在W3​​C网站上看到了:

  

以下元素支持   tabindex属性:A,AREA,BUTTON,   INPUT,OBJECT,SELECT和TEXTAREA。

所以我有点困惑,为了使标准符合标准并使我的用例有用,该怎么做?

EDIT2

我的整个用例是一个带有大量内容的div,带有一个人工滚动条。我可以用鼠标事件滚动它,但到目前为止没有运气键盘。

2 个答案:

答案 0 :(得分:27)

2017年更新

正如@Wallop在评论中指出的那样,由于“缺乏实施兴趣”,2015年nav-index属性为dropped from the spec


CSS3-UI中查看W3C引入的nav-index属性。

此属性与tabindex具有完全相同的行为,适用于任何元素。

  

'nav-index'属性是一种指定顺序导航顺序(也称为“制表顺序”)的输入方法中立方式。   此属性替代HTML4 / XHTML1属性'tabindex'

可能是用例的最佳标准兼容解决方案,nav-index目前仅由Opera解释(截至2012年6月),并且也被W3C标记为“风险特征”,因此可能是随时都放弃了。

其他跨浏览器解决方案包括:

  • 不符合标准:在tabindex上设置DIV属性。这适用于所有常见浏览器。

  • 符合标准:将DIV替换为锚元素(A)而不设置href属性,使用display: block设置样式并添加{{ 1}}属性。

关于BoltClock的观点,我同意标签顺序是非常合理的(文本选择顺序和标签顺序都与文档中元素排列的顺序密切相关)。另一方面,CSS今天有更广泛的用途。它不仅可以操作文档的内容(tabindex属性),还可以操作触发事件的行为:即使用contentpointer-eventsdisplay指针事件的顺序会改变。如果这些是非常基本的CSS属性,为什么你也不能影响KeyBoardEvents呢?

答案 1 :(得分:7)

这有点旧,但现在有像-moz-user-focus这样的css选项。我确信有一个webkit等价物。

https://developer.mozilla.org/en-US/docs/CSS/-moz-user-focus