2014-02-25 45 views
1

我有一些我支持的代码有tabindex="1.1"tabindex="1.2"等。我正在考虑将值更改为整数。这会改善浏览器行为吗?用户代理应该如何处理tabindex和z-index的非整数值?

W3C says

的tabindex = [CN]

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

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

This reference说:

NUMBER

的数字。数字必须以连字符或数字开头,并可包含小数点。

因此,如果您使用小数点但标记有意义,则标记有效?

我的问题是用户代理应该尊重小数点后面的数字还是只使用整数部分?即上述两个值应该被视为相同还是不同?为什么你会用这些值来支持tabindex="11",tabindex="12"等等? z-index也是一样。

回答

1

正如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和IE一样)并不支持tabindex值的小数部分。 HTML/CSS规范说这应该是一个不可或缺的价值。

编辑:这同样适用于z-index还有:http://jsfiddle.net/NWKt4/3/

+0

“应该”我的意思是在规范中定义为“应该”,“必须”,“可以”等,而不是个人意见。我个人的观点是它不应该这样做,但如果有一个说明其他内容的规范,我的意见并不重要。感谢jsfiddles! –

+1

这不是主观的。在规范中声明'z-index'属性和'tabindex'属性都只接受整数。 –

+0

@DavidStorey - 正确。我正在关注OP中提供的信息,它只是说该值应该是一个数字,而一个“数字”可以包含一个小数点/小数部分。 – aroth

0

这样做的一个可能的原因是弥补了原始开发者没有远见在tabindex方案中留下空白。

最初的开发者经历并给出表单字段tabindexes 1,2,3等等,直到一些大数目。

下一个开发人员添加更多的字段中的字段1和2之间,但不能将它们插入到tabindex属性方案不正确重新编号自带之后,这是有点儿跛一切。

因此,下一个开发人员使用1.1,1.2等。如果它有效并且有效,那就没问题。理想情况下,你会使用整数。

+0

但是,您可能会认为所有tabindexes都以“1.”开头!去搞清楚! –

6

一个z-index有小数位将被忽略,因为它是无效的:

“值:自动| < integer> |继承“ - CSS 2.1 spec

您可以使用CSS Validator自行检查。

你可以看到在tabindex的属性,小数也无效通过检查属性tabindex属性上的div元素的HTML5 Validator

“坏价值1.2:预期的一个数字却看见了。而不是”

如果检查规范它指出:

‘tabindex属性的属性,如果指定,必须有一个值是一个有效的整数’ - HTML5.1 Spec

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

+0

很好的答案!你会期望HTML和CSS规格一致,不是吗? –

+0

验证程序不会告诉浏览器应该如何处理这些错误。这里没有引用规范和草案的部分内容。 –

+0

@ JukkaK.Korpela CSS规范明确指出无效的CSS应该被忽略。这就是错误处理在CSS中的工作原理。 HTML5规范还定义了错误处理。我附带了一个包含演示的验证器链接,以说明它们是无效的。 –

1

答案在标题(?用户代理应如何处理与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"相反),所以应将它们设置为不同的整数。如果这些元素意图以值为1和2的元素之间的标签顺序出现,则无法实现这一点 - 您还需要修改其他值,同时适当考虑页面上使用的所有tabindex值。

问题中的另一个参考是DocBook元素参考,它与HTML无关。

关于这个问题:“为什么你会使用这些值?”,我们只能推测作者有tabindex="1"tabindex="2",并把他们之间的事情在Tab键顺序必要的,误以为有小数点的数字可能是用过的。这个错误可能没有被注意到,因为具有相同tabindex值的元素在规范中并且在实践中被置于Tab键顺序中,以便它们的相互顺序是按HTML源代码的顺序排列的 - 并且这可能符合意图。