使 HTML 元素不可聚焦

Question

是否可以使 HTML 元素 不可聚焦？

我知道可以定义一个 可以接收焦点的元素列表， 并且用户可以通过按 Tab 键来浏览这些元素。我还看到由浏览器来控制它。

但也许有一种方法可以使某些元素不可聚焦，比如我希望用户在按下 Tab 时跳过某个 <a> 标签。

原文由 Alvis 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

<a href="http://foo.bar" tabindex="-1">unfocusable</a>

负值意味着该元素应该是可聚焦的，但不应通过顺序键盘导航访问。

另见： developer.mozilla.org

原文由 Fedor Skrynnikov 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

要完全阻止焦点，而不仅仅是在使用 选项卡 按钮时，请将 disabled 设置为 HTML 元素中的属性。

 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>

<input class="form-control" type="text"> Click this, you can see it's focusable.

<input class="form-control" type="text" readonly>  Click this, you can see it's focusable.

<input class="form-control" type="text" readonly tabindex="-1">  Click this, you can see it's focusable. Not tab'able.

<input class="form-control" type="text" disabled>  Click this, you can see it's <strong>not</strong> focusable.

原文由 Randy 发布，翻译遵循 CC BY-SA 3.0 许可协议