将空白选项添加到选择顶部,并使其成为IE中的选定选项

时间:2011-08-18 14:32:12

标签: jquery html forms

HTML:

<select id="dropdown">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

jQuery的:

$("#dropdown").prepend("<option value='' selected='selected'></option>");

当我在FireFox或Chrome中运行时,下拉列表中选中了新插入的空白选项。当我在IE8中运行时,它仍然选择了沃尔沃。有什么想法吗?

http://jsfiddle.net/YFu2h/

4 个答案:

答案 0 :(得分:38)

将其更改为此,它将起作用:

$("#theSelectId").prepend("<option value=''></option>").val('');

http://jsfiddle.net/YFu2h/1/

IE似乎只会在第一次遇到selected时评估select属性。

答案 1 :(得分:10)

我不确定为什么你的代码不起作用(也许它与IE中的selectedIndex是只读的事实有关)但是,这样做在IE中工作:

$("#dropdown").prepend("<option value='' selected='selected'></option>");
$("#dropdown")[0].options[0].selected = true;

答案 2 :(得分:3)

尝试:

$("#dropdown").prepend(new Option('', '', true, true));
$("#dropdown option:first").attr("selected", "selected");

或者,如果您愿意:

$("#dropdown").prepend("<option value=''></option>");
$("#dropdown option:first").attr("selected", "selected");

使用第一个选项稍快一些。空白引号表示空白值和空白文本,因此请根据需要填写。现在我们在之前添加它们时,您不需要前置中的selected属性。这与Internet Explorer没有意识到它被标记为已选中,因为它刚刚创建。

答案 3 :(得分:2)

$("#id").prepend("<option value=' ' selected='selected'></option>");

前置将在顶部添加该选项,并且 selected ='selected'将其选中。由于value ='',因此它是空白值选项。