title | slug |
---|---|
tabindex |
Web/HTML/Global_attributes/tabindex |
{{HTMLSidebar("Global_attributes")}}
tabindex 全局属性 指示其元素是否可以聚焦,以及它是否/在何处参与顺序键盘导航(通常使用Tab键,因此得名)。
{{EmbedInteractiveExample("pages/tabbed/attribute-tabindex.html","tabbed-standard")}}
它接受一个整数作为值,具有不同的结果,具体取决于整数的值:
- tabindex=负值 (通常是 tabindex=“-1”),表示元素是可聚焦的,但是不能通过键盘导航来访问到该元素,用 JS 做页面小组件内部键盘导航的时候非常有用。
tabindex="0"
,表示元素是可聚焦的,并且可以通过键盘导航来聚焦到该元素,它的相对顺序是当前处于的 DOM 结构来决定的。- tabindex=正值,表示元素是可聚焦的,并且可以通过键盘导航来访问到该元素;它的相对顺序按照tabindex 的数值递增而滞后获焦。如果多个元素拥有相同的 tabindex,它们的相对顺序按照他们在当前 DOM 中的先后顺序决定。
根据键盘序列导航的顺序,值为 0
、非法值、或者没有 tabindex 值的元素应该放置在 tabindex 值为正值的元素后面。
如果我们在 {{htmlelement("div")}} 上设置了 tabindex
属性,它的子元素内容不能使用箭头键来滚动,除非我们在内容上也设置 tabindex
。查看这篇 fiddle 来理解 tabindex 的滚动影响。
Note
tabindex 的最大值不应超过 32767。如果没有指定,它的默认值为 0。
{{Specifications}}
{{Compat}}
- 所有全局属性
- 反映这个属性的 {{domxref("HTMLElement.tabIndex")}}
- tabindex 的无障碍问题:请见 不要使用大于 0 的 Tabindex | Adrian Roselli。