Question

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

示例

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');

Live example on JSFiddle.net .

我找不到任何关于这应该做什么的文档（虽然它似乎改变了下拉框中的选定选项）。

我在Firefox中尝试过，发现在<option>上设置属性有时会选择该选项，有时则不会，而在Chrome中它始终有效。那该怎么办呢？这是在任何规范中描述的吗？

注意：的

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

Answer 1

HTML 5.1规范说明了option元素

选项元素的选择性最初是布尔状态假。 ...每当添加选项元素的选定属性时，其选择性必须设置为true。

因此，当调用setAttribute（“selected”，...）时，content属性获得属性值，元素的“selectedness”状态可能会改变。请注意，它表示当元素选定属性添加时，选项元素的选择性设置为true。这意味着如果您对已具有所选属性的元素调用setAttribute('selected','selected')，则不要求该元素或任何其他选项元素的选择性发生更改。

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

获取时所选的IDL属性必须返回true element的选择性为true，否则为false。

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

然后，对于select元素，它说：

如果多个属性不存在，则每当一个选项元素出现时 select元素的选项列表的选择性设置为true，... 用户代理必须设置所有其他选项的选择性其选项列表中的元素为false。

和

selectedOptions IDL属性必须返回以root为单位的HTMLCollection   在select节点上，其过滤器与列表中的元素匹配   选择性设置为true的选项。

在获取时，selectedIndex IDL属性必须返回索引   树顺序中的选项列表中的第一个选项元素   其选择性设置为true，如果有的话。如果没有，那就必须   返回-1。

获取时，值IDL属性必须返回值   树顺序中的选项列表中的第一个选项元素   选择性设置为true，如果有的话。如果没有，那就必须   返回空字符串。

并在提交表单时constructing the form data set：

如果field元素是select元素，则为每个option元素在select元素的选择列表中，其选择性为真和如果没有禁用，请在表单数据集中附加一个条目 name作为名称，option元素的值作为值，以及输入类型。

这是否涵盖了您需要知道的内容？

如果我通过Javascript更改<option>元素上的“selected”属性会怎样？</option>

1 个答案: