使用tab键导航时,我可以忽略一些网站元素吗?

时间:2010-05-03 12:31:54

标签: html css accessibility tabindex

真的是问题。我在页面上有一个输入框,我想在使用键盘标签键导航时忽略它。

我正在使用这个输入框作为一个简单的机器人蜜罐并将其放置在页面之外,所以在使用tab键的那一刻,当用户选中此元素时,它会向用户显示没有任何焦点。 / p>

4 个答案:

答案 0 :(得分:50)

您可以在此元素上设置tabindex="-1",以便在Tab键顺序中忽略它。 0告诉浏览器自己找出标签顺序,-1告诉浏览器忽略它。

答案 1 :(得分:12)

您可以使用tabindex属性来定义Tab键循环元素的顺序。如果设置tabindex="-1",则会跳过该元素。

例如,http://www.webcheatsheet.com/HTML/controll_tab_order.php可提供更多信息。

<强>更新 根据评论

将tabindex =“0”更改为“-1”

答案 2 :(得分:1)

display: none相反。

答案 3 :(得分:0)

我在输入元素上使用了解决方法disabled标志,因为在我的情况下不需要用户输入:)

具有3个输入的示例:

.container {
  display: flex;
  flex-direction: column;
}
input {
  width: 200px;
  margin-bottom: 10px;
}
<div class="container">
  <input placeholder="Not disabled"/>
  <input placeholder="Disabled - skipped by tab" disabled/>
  <input placeholder="Not disabled"/> 
</div>

希望它对<3-Chrome,Edge,Firefox和经过测试的“伪”浏览器IE都适用。