如何从tabindex忽略HTML元素?

在HTML中是否有任何方法告诉浏览器不允许对特定元素进行标签索引?

在我的页面上，虽然有一个用jQuery渲染的边秀，当你通过选项卡时，你会在选项卡控件移动到页面上的下一个可见链接之前按很多选项卡，因为所有被选项卡通过的东西在视觉上都隐藏在用户面前。

256417 次浏览
小开
最佳答案

你可以使用tabindex="-1"。

只有在确定它不会移除键盘用户的功能时才这样做。

W3C HTML5规范支持负的tabindex值:

< p > 如果为负整数
用户代理必须设置元素的tabindex焦点标志，但不应该允许使用顺序焦点导航到达元素
注意，这是HTML5的一个功能，可能不适用于旧的浏览器。
要符合W3C HTML 4.01标准(从1999年开始)， tabindex必须是正的

下面是纯HTML的示例用法。

<a href="#" onclick="return false">Focusable</a>
<a tabindex="-1" href="#" onclick="return false">Not focusable</a>
<a href="#" onclick="return false">Focusable</a>

小开

不要忘记，尽管tabindex在规范和HTML中都是小写的，但在Javascript/ DOM中，该属性被称为tabIndex。

不要失去你的头脑，试图弄清楚为什么你通过编程改变的制表索引调用element.tabindex = -1不起作用。使用element.tabIndex = -1。

小开

如果这些元素像按钮和锚一样自然地存在于标签顺序中，那么使用tabindex="-1"将它们从标签顺序中移除是一种可访问性气味。如果它们提供重复的功能，将它们从tab顺序中删除是可以的，并考虑将aria-hidden="true"添加到这些元素中，以便辅助技术将忽略它们。

小开

只需将属性disabled添加到元素(或使用jQuery为您完成)。禁用可阻止集中或完全选择输入。

小开

如果你在一个不支持tabindex="-1"的浏览器中工作，你可以只给出需要跳过的一个非常高的TAB索引。例如，tabindex="500"基本上是将对象的制表符顺序移动到页面的末尾。

我在一个很长的数据输入表单中使用了这种方法，在表单中间放置了一个按钮。这不是一个人们经常点击的按钮，所以我不想让他们意外地点击它并按下enter键。disabled将不起作用，因为它是一个按钮。

小开

这样做的方法是添加tabindex="-1"。通过将它添加到一个特定的元素，它就变成了键盘导航的遥不可及的。有一篇很棒的文章在这里将帮助你进一步理解tabindex。


提交答案