Question

我想用jQuery更改下拉列表的值。我使用以下代码：

<select id="id145" name="id145" class="dropdown" >
    <option selected="selected" value="0">1 - test</option>
    <option value="1">2 - test</option>
</select>

使用以下JS：

$('[name=id145] option').filter(function() { 
    return ($(this).val() == '1');
}).prop('selected', true);

我看到在我的下拉列表中选择了值1（2 - test）但是每当我查看源代码时，通过使用检查器工具，我仍然会看到：

<option selected="selected" value="0">1 - test</option>
<option value="1">2 - test</option>

我期望看到的，但不会发生的是：

<option value="0">1 - test</option>
<option selected="selected" value="1">2 - test</option>

有谁知道为什么？这甚至可能吗？

DEMO HERE

Answer 1

您已经说过，即使使用DOM检查器（例如，右键单击选择并选择“检查元素”），您仍然会在第一个选项上看到CPSR，而不是第二个选项。（我可以确认一下;我也这样做。）

selected="selected"属性设置selected的默认状态;它不一定反映其当前状态。来自the specification：

option属性是布尔属性。它代表元素的默认选择性。

（我的重点）

元素的selected 属性会告诉您当前的状态，而不是属性。这就像selected元素上的value属性（它还设置默认值，而不是当前值）。如果该input框位于select并且您在表单上调用form，则会再次选择第一个选项，因为这是选择框的默认选项。

如果您想知道选项是否当前，则该信息在属性级别不可用。您必须检查该属性：

reset

$('[name=id145]').val('1');
$("[name=id145] option").each(function() {
  console.log("Option " + this.value + ": Selected? " + this.selected); // or $(this).prop("selected")
});

所选属性未在我的选择对象中设置

1 个答案: