"option"标签的"selected"属性中可以显示哪些值？

Question

我有一些类似于以下的标记:

<select>
  <option selected="selected">Apple</option>
  <option selected="">Orange</option>
</select>

在这种情况下,"橙色"显示为所选项目.我原本期望将selected属性设为空白会撤消其效果.有没有办法写这个而不是简单地离开属性？

Answer 1

不同的浏览器可以不同地处理此属性 根据MSDN文档(适用于Internet Explorer):

要在HTML中选择项目,不必将SELECTED属性的值设置为true.仅存在SELECTED属性将其值设置为true.

在Firefox和Safari中,这确实有效:

<option selected='false' />

通过查看HTML4的官方WC3标准我可以看出,支持的案例仅包括:

<option selected='selected' />

您将需要有选择地发出属性,或使用javascript来控制最初选择的项目.

Answer 2

HTML5规范

https://www.w3.org/TR/html51/sec-forms.html#the-option-element

所选内容属性是布尔属性.

http://www.w3.org/TR/html5/infrastructure.html#boolean-attributes:

元素上存在布尔属性表示真值,缺少属性表示false值.

如果该属性存在,则其值必须是空字符串,或者是属性的规范名称的ASCII不区分大小写匹配的值,没有前导或尾随空格.

结论

以下是有效,等效和真实的:

<option selected />
<option selected="" />
<option selected="selected" />
<option selected="SeLeCtEd" />

以下是无效的:

<option selected="0" />
<option selected="1" />
<option selected="false" />
<option selected="true" />

缺少该属性是false的唯一有效语法:

<option />

建议

如果您关心编写有效的XHTML,请使用selected="selected",因为它<option selected>是无效的,而其他替代方案的可读性较差.否则,只需使用<option selected>它,因为它更短.

Answer 3

XHTML中所选属性的唯一允许值是"已选中 ",因此如果您希望您的标记符合XHTML并且在所有浏览器中工作,则将其取消是唯一的选择,使其不被选中

Answer 4

在 HTML（相对于 XHTML）中，一个selected没有任何值的简单属性可以正常工作：

<option selected>Apple</option>
<option>Orange</option>

在 XHTML（包括 XHTML5）中，您需要一个值，该值也应该是selected：

<option selected="selected">Apple</option>
<option>Orange</option>

这在 HTML 中也能正常工作。

(X)HTML 中的布尔值通常就是这种情况。将它们设置为 false 的方法是完全忽略它们。设置true和的值false可能有效，但不是标准的。

请注意，对于选项列表，默认情况下会选择第一个，因此在这种情况下根本没有必要。