无法从select选项中删除selected="selected“

Question

我尝试从选择框中删除selected="selected“的部件。

这是选择框

<select id="editsite_TREE_PARENT_ID" name="newsite_TREE_PARENT_ID" class="form-control input-medium">
          <option value="ROOT">root</option>
          <option value="1" selected="selected">index</option>
          <option value="2">impressum</option>                                                          
</select>

这就像我试着去做，但它不会起作用--什么都没有发生，我不知道为什么？

$("#editsite_TREE_PARENT_ID").find("option:selected").removeAttr("selected");'

更改为

$("#editsite_TREE_PARENT_ID").find("option[selected]").removeAttr("selected");

解决了这个问题，但现在我有了一个新问题。

删除选项并为选项设置新选项后，当前选项将不会在下拉框中显示为选中状态(在源码中，但不显示)。我的意思是这个选项不是预先选定的。可能的原因是什么？

Answer 1

它可能没有做任何事情，因为选定的属性基于下拉列表中的活动/当前选择，这是不会改变的(行为可能取决于浏览器)。如果要更改索引，请尝试将所选索引切换为所需的索引。所以就像这样：

$("#editsite_TREE_PARENT_ID").val(0)

jquery引用：

http://api.jquery.com/val/

Answer 2

如果具有选定属性的选项当前处于选中状态，则该选项应该有效，但如果未选中该属性，则该选项将不起作用。

:selected选择器查找当前选定的选项，而不是具有选定属性的选项。

试一试

$("#editsite_TREE_PARENT_ID").find("option[selected]").removeAttr("selected");

Answer 3

它工作得很好。

​

$("#target").click(function() {
  $("#editsite_TREE_PARENT_ID").find("option:selected").removeAttr("selected");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<select id="editsite_TREE_PARENT_ID" name="newsite_TREE_PARENT_ID" class="form-control input-medium">
          <option value="ROOT">root</option>
          <option value="1" selected="selected">index</option>
          <option value="2">impressum</option>                                    
</select>
<br><br>
<div id="target">click me</div>

​