6

即使指定了 tabindex，是否有人拥有不可选项卡的 HTML (HTML5) 元素列表？（通过tabbable，我的意思是他们可以通过反复按“tab”键来获得焦点。）

我们知道有些元素默认是可选项卡的，例如input或textarea。我们还知道，有些元素只有在明确指定 tabindex 时才可以 tabbable，例如div和span元素。

根据 W3Schools 的说法，“在 HTML5 中，tabindex 属性可以用于任何 HTML 元素”。但是，肯定有一些元素是不可标签的，即使它们有标签索引。例如，param元素可选项卡或head元素是没有意义的。我也不认为该option元素可能是可标签的，但我不确定。而且我更不确定诸如mapwhich 可以包含可选项卡元素但通常本身不能选项卡之类的东西。

有人可以给我一个列表，列出所有即使有 tabindex 也永远无法获得焦点的元素？

4

2 回答 2

9

由于还没有人提出任何明确的列表，我在一个相当新的 Chrome 版本上进行了一些测试，并提出了以下根本不可选项卡的元素列表：

  • <base>
  • <basefont>
  • <embed>
  • <head>
  • <link>
  • <meta>
  • <object>
  • <param>
  • <source>
  • <style>
  • <title>
  • <track>

不幸的是，由于我只花了几个小时来编写这个列表，它有一些警告：

  1. 未在 Chrome 以外的任何浏览器上测试
  2. 我跳过了大部分我认为可能是可选项卡的元素（因为它们会有正常显示的内容）
  3. 我没有尝试设置任何要显示的内容（除了<title>我的评论）

我最惊讶的是以下元素是可选项卡的：

  • <audio>和<video>（惊讶，因为<embed>和<object>不是）
  • <br>和<wbr>
  • <col>和<colgroup>
  • <frame>和<frameset>（尽管它们更像是一种特殊情况，因为它们在 HTML 中不是技术上有效的元素）
  • <html><body>（这和从标签的角度来看几乎没有区别）
  • <optgroup>并且<option>（尽管对它们进行制表符并没有给出任何视觉指示 - 即选择框没有打开）
于 2013-01-04T18:44:55.910 回答
8

HTML 规范列出了元素可聚焦的条件以及tabindex 的解释方式。

  • 设置了元素的 tabindex 焦点标志。
  • 该元素要么正在呈现，要么是表示嵌入内容的画布元素的后代。
  • 该元素及其任何祖先都不是惰性的。
  • 该元素未被禁用。

定义依赖于被渲染的元素，使用 CSS 你可以渲染任何元素。例如，可聚焦<param>且均匀的<title>and <basefont>：

<!DOCTYPE>
<title tabindex=0>Test</title>
<basefont tabindex=0>
<style>
head, title {display:block}
basefont, param {content: url(image.png);}
</style>
<object><param tabindex=0></object>

顺便说一句：忽略 W3Schools——通常这不是一个可靠/权威的来源。

于 2013-01-04T18:41:12.243 回答