什么是引导程序中的tabindex =“ – 1”
Bootstrap 3中的tabindex
属性是什么?
它的文档没有提到任何关于它们的内容,尽pipe它们实际上在所有的模式中使用它们。
我只是发现这个用法,其实并不多
可访问键盘和辅助技术用户的工具提示
对于使用键盘进行导航的用户,特别是辅助技术用户,只能将工具提示添加到键盘可聚焦的元素,例如链接,表单控件或具有tabindex =“0”属性的任意元素。
我发现如果tabindex
属性不是-1
, 我不能按esc
来隐藏模式 。
- 按
esc
键后的模式closures(用tabindex) - 按
esc
键后没有closures模式(没有tabindex)
tabindex
属性明确定义了页面内可聚焦元素(通常是链接和表单控件)的导航顺序。 它也可以用来定义元素是否应该是可以聚焦的。[both]
tabindex="0"
和tabindex="-1"
在HTML中有特殊的含义并提供不同的function。 值为0
表示该元素应该放置在默认的导航顺序中。 这允许非本地可聚焦元素(如<div>
,<span>
和<p>
)接收键盘焦点。 当然,人们通常应该使用所有交互元素的链接和表单控件,但是这确实允许其他元素可以聚焦并触发交互。一个
tabindex="-1"
值将元素从默认的导航stream中移除 (即用户不能选中),但是它允许它接收编程焦点 ,这意味着焦点可以通过链接或脚本来设置。 **这对于不应该被标记的元素非常有用,但是可能需要为它们设置焦点 。一个很好的例子是一个模式对话框窗口 – 打开时,应该将焦点设置到对话框,以便屏幕阅读器开始阅读 ,键盘将开始在对话框中导航 。 由于对话框(可能只是一个
<div>
元素)默认是不可聚焦的,因此赋予它tabindex="-1"
可以通过脚本将焦点设置为它。在使用箭头键或其他快捷键的复杂小部件和菜单中,值
-1
也可以是有用的,以确保小部件中只有一个元素可以用tab键导航,但仍然可以在焦点被设置在小部件。
来源: http : //webaim.org/techniques/keyboard/tabindex
这就是为什么你需要tabindex="-1"
的模式<div>
,所以用户可以访问常见的鼠标和键盘快捷键。 希望有所帮助。