2

如果我<option>通过 Javascript 更改元素上的“选定”属性会发生什么?

例子

HTML

<select size="1" id="myselect">
  <option>pepper</option>
  <option selected="selected">salt</option>
</select>

Javascript

    var selectObj = document.getElementById('myselect');
    selectObj.options[1].removeAttribute('selected');
    selectObj.options[0].setAttribute('selected','selected');

JSFiddle.net 上的实时示例。

我找不到任何关于这应该做什么的文档(尽管它似乎改变了下拉框中的选定选项)。

我在 Firefox 中尝试过,发现在 an 上设置属性<option>有时会选择该选项,有时不会,而在 Chrome 中它总是有效。那么它应该做什么呢?这在任何规范中都有描述吗?

笔记:

我知道我可以通过 JS 使用 egoption.selected=true/false或更改选择select.value=<newval>。所以我的问题不是找出如何更改选择;我只想了解如果我操纵该属性会发生什么。

4

1 回答 1

1

HTML 5.1 规范说,对于option元素

选项元素的选择是一个布尔状态,最初为假。... 每当添加选项元素的 selected 属性时,必须将其选中状态设置为 true。

所以当 setAttribute("selected", ...) 被调用时,内容属性获得了属性值,并且元素的“selectedness”状态可能会改变。请注意,虽然它说选项元素的选定性设置为 true 时添加元素的选定属性。这意味着如果您调用setAttribute('selected','selected')一个已经具有 selected 属性的元素,则不需要更改元素的选中性或任何其他选项元素。

接下来是改变元素的“选择性”的后果。

selected IDL 属性在获取时,如果元素的选择为真,则必须返回真,否则返回假。

(如果您不熟悉术语,“IDL 属性”是大多数人认为的“属性”。例如opt.selected

然后,对于select元素,它说:

如果multiple 属性不存在,只要选择元素的选项列表中的选项元素将其选择性设置为true,......用户代理必须将其选项列表中所有其他选项元素的选择性设置为false。

selectedOptions IDL 属性必须返回一个以选择节点为根的 HTMLCollection,它的过滤器匹配选项列表中选择性设置为 true 的元素。

selectedIndex IDL 属性在获取时必须以树顺序返回选项列表中的第一个选项元素的索引,该选项的选择性设置为 true(如果有)。如果没有,那么它必须返回 -1。

value IDL 属性在获取时必须返回选项列表中的第一个选项元素的值,该选项元素的选择性设置为 true,如果有的话。如果没有,则它必须返回空字符串。

并在提交表单时,在构建表单数据集期间:

如果 field 元素是一个 select 元素,那么对于 select 元素的选项列表中的每个选项元素,其选中状态为 true 且未被禁用,将一个条目附加到表单数据集中,名称为名称,选项元素作为值,类型作为类型。

这是否涵盖了您需要了解的内容?

于 2013-10-12T01:52:37.303 回答