Добавьте пустую опцию к вершине выбора и сделайте ее выбранной опцией в IE

Question

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, в нем все еще выбран Volvo.Есть идеи?

http://jsfiddle.net/YFu2h/

Answer 1

Измените его на это, и оно будет работать:

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

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

Кажется, что IE оценивает атрибут selected только тогда, когда он впервые встречает select.

Answer 2

Я не уверен, почему ваш код не работает (возможно, это связано с тем, что в IE selectedIndex только для чтения), но в IE это работает:

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

Answer 3

Попробуйте:

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

Или, если вы предпочитаете:

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

Использование первого варианта незначительно быстрее.Пустые кавычки означают пустое значение и пустой текст, поэтому заполните их, как вам нужно.Вы не нуждаетесь в выбранном атрибуте в prepend, теперь мы добавляем его позже.Это связано с тем, что Internet Explorer не распознает, что он помечен как выбранный, поскольку он только что был создан.

Answer 4

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

prepend добавит параметр сверху, а selected = 'selected' сделает его выбранным. Поскольку значение = '', значит, это пустая опция значения.