Question

我有一些我支持的代码tabindex="1.1"，tabindex="1.2"等等。我正在考虑将值更改为整数。这会改善浏览器行为吗？

W3C says：

tabindex = 数字 [CN]

此属性指定当前文档的Tab键顺序中当前元素的位置。该值必须是介于0和32767之间的数字。用户代理应忽略前导零。

没有说明应该如何处理非整数值。

This reference说：

NUMBER

一个数字。数字必须以连字符或数字开头，并且可以包含小数点。

因此，如果使用小数点，则标记有效但有意义吗？

我的问题是，用户代理应该尊重小数点和后面的数字还是只使用整数部分？即上述两个值是否应视为相同或不同？为什么要使用这些值来支持tabindex="11"，tabindex="12"等？ z-index也是如此。

Answer 1

带小数位的z-index将被忽略，因为它无效：

“价值：自动| ＆LT;整数＆GT; |继承“ - CSS 2.1 spec。

您可以使用CSS Validator。

自行检查

通过查看HTML5 Validator

，您可以看到tabindex属性中的小数位也无效

“元素div上属性tabindex的错误值1.2：预期数字但是看到了。代替”

如果您查看规范，请说明：

“tabindex属性（如果已指定）必须具有有效整数值。” - HTML5.1 Spec

HTML5中的错误处理与CSS的工作方式不同。在这种情况下，由于值必须是整数，因此它遵循rules for parsing an integer。相关部分是“当调用时，必须按照给定的顺序执行步骤，在返回值的第一步中止。”和“如果由位置指示的字符不是ASCII数字，则返回错误。”小数位不是ASCII数字，因此将返回错误，小数位前的数字将用作整数。在这种情况下，每个tab index为1。

Answer 2

如David的回答所述，当前的HTML / CSS规范显然需要这些属性的整数值。不支持十进制值。

上述两个值应该被视为相同还是不同？

就应该而言，我认为它们会被视为不同的值，并且基本上被解析为浮点数。然而，快速的jsFiddle测试显示其他情况，至少在Chrome中。

<input type="text" placeholder="start here" tabindex="1" />
<input type="text" placeholder="tab 3" tabindex="1.3" />
<input type="text" placeholder="tab 2" tabindex="1.2" />
<input type="text" placeholder="tab 1" tabindex="1.1" />
<hr />
<input type="text" placeholder="start here" tabindex="10" />
<input type="text" placeholder="tab 3" tabindex="13" />
<input type="text" placeholder="tab 2" tabindex="12" />
<input type="text" placeholder="tab 1" tabindex="11" />

http://jsfiddle.net/NWKt4/2/

为什么要使用这些值来支持tabindex =“11”， tabindex =“12”等？

根据上面的结果，我建议你不要/不应该使用十进制值来支持积分值，因为它们似乎不像人们期望的那样工作。

我的问题是用户代理应该尊重小数点和之后的数字或只是使用整数部分？

这似乎有些主观。所以我的主观回答是肯定的，当然他们应该这样做。

然而，在实践中，主流浏览器（Firefox与Chrome的功能与IE相同）似乎并不支持tabindex值的小数部分。 HTML / CSS规范说这应该是一个整数值。

修改：同样适用于z-index：http://jsfiddle.net/NWKt4/3/

Answer 3

标题中的问题答案（用户代理如何处理tabindex和z-index的非整数值？）如下：

HTML 4.01（在问题中引用）没有为此指定规则。它明确地说（在4.1 Definitions中）它“没有定义合规用户代理如何处理一般错误条件”。但是，它建议“如果用户代理遇到它无法识别的属性值，则应使用默认属性值。”tabindex属性没有默认值，因此不清楚应如何解释
HTML5 CR，通常被引用为标准defines the tabindex attribute，因此其值“使用解析整数的规则进行解析”，定义为使解析在句点“。”处停止。在给定情况下的字符，并且这两个属性都被解析为tabindex="1"。
z-index属性是CSS，而不是HTML。通过CSS rules for handling parsing errors，“用户代理必须忽略具有非法值的声明”。例如，#foo { z-index: 1.2; width: 60% }因此应被视为#foo { width: 60% }（即，忽略具有非法值的声明，但正常处理同一规则中的其他声明。）

在实践中，浏览器在此处应用HTML5 CR原则（或者，HTML5 CR已经编写以反映浏览器实践）。在IE，Firefox，Chrome上测试过。但是，尽管IE 11正确处理了错误的代码tabindex="1.1"，但对于其他一些错误情况（例如tabindex="42A"，它被错误地视为tabindex=0）则无法执行此操作。

因此，将值更改为整数将是正确的（任何HTML规范的当前代码都是错误的）。它是否会改善浏览器行为取决于代码的用途以及您将使用的值。由于预计值可能会产生不同的影响（与tabindex="1"相反），您应该将它们设置为不同的整数。如果元素在tabindex值为1和2的元素之间以Tab键顺序显示，则无法实现 - 您需要修改其他值，同时适当考虑使用的所有tabindex值在页面上。

问题中的另一个参考是DocBook Element Reference，它与HTML无关。

关于“为什么要使用这些值？”这个问题，我们只能推测作者有tabindex="1"和tabindex="2"，并且需要在制表顺序中放置一些内容，并错误地认为可以使用带小数点的数字。这个错误可能没有被注意到，因为具有相同tabindex值的元素在规范和实践中被放置在Tab键顺序中，以便它们的相互顺序是它们在HTML源中的顺序 - 这可能与意图。

Answer 4

这样做的一个可能原因是弥补原先没有远见的原始开发人员在tabindex计划中留下空白。

原始开发人员通过并给表单字段tabindexes 1,2,3，依此类推，直到一些大数字。

下一个开发人员在字段1和字段2之间添加了更多字段，但是无法正确地将它们插入到tabindex方案中，而无需对其后面的所有内容重新编号，这有点蹩脚。

所以下一个开发人员使用1.1,1.2等。如果它有效且有效，那很好。理想情况下，你会使用整数。

User Agents如何处理tabindex和z-index的非整数值？

4 个答案: