Невозможно установить выбор в выпадающем списке выбора с JavaScript в IE8

Question

Учитывая следующую функцию javascript,

function switch_plug_drop_down(plug_id) {
      selector = document.getElementById('group_1');
      if (plug_id == "1") {selector.options['product_253'].selected = true;}
      if (plug_id == "2") {selector.options['product_217'].selected = true;}
      if (plug_id == "3") {selector.options['product_254'].selected = true;}
      if (plug_id == "4") {selector.options['product_255'].selected = true;}
      if (plug_id == "5") {selector.options['product_256'].selected = true;}
  }

и следующий HTML-элемент select (сгенерированный cs-cart)

<select name="product_data[245][configuration][1]" id="group_1" onchange="fn_check_exceptions(245);fn_check_compatibilities(1,'select','S');"> 
    <option id="product_255" value="255"  >Power Adapter Plug Choice AUS<span class="price"></span></option> 
    <option id="product_217" value="217"  >Power Adapter Plug Choice EURO<span class="price"></span></option> 
    <option id="product_256" value="256"  >Power Adapter Plug Choice JAPAN<span class="price"></span></option> 
    <option id="product_254" value="254"  >Power Adapter Plug Choice UK<span class="price"></span></option> 
    <option id="product_253" value="253" selected="selected"} >Power Adapter Plug Choice USA / Canada<span class="price"></span></option> 
</select> 

Это прекрасно работает в FF 3.6.8, Chrome 5.0.375, но не работает в IE 8 (режим браузера 8, режим документа IE8 Standard)

Я получаю сообщение об ошибке в отладчике JavaScript IE 8:

'selector.options.product_217' is null or not an object

и это соответствует selector.options['product_217'].selected = true; в коде js выше.

Также на сайте есть jQuery 1.3.n и работает нормально.

Кто-нибудь знает, что происходит и как это исправить?

ОБНОВЛЕНИЕ:

Я реализовал решение Тима, но автоматически загрузил значения:

selector = document.getElementById('group_1');
for (var i = 0; i < selector.children.length; ++i) {
    var child = selector.children[i];
    if (child.tagName == 'OPTION') optionIndicesByPlugId[child.value]=''+i;
}

(этот код взят из первого ответа на этот вопрос SO )

и plug_id, который передается в функцию switch_plug_drop_down, больше не является числом 1-5, а значением в select.

Answer 1

Свойство select options не обязательно содержит свойства, соответствующие значению каждого параметра.Большинство браузеров (не IE) реализуют его как HTMLOptionsCollection, что вводит в заблуждение: спецификации DOM и MDC , похоже, предполагают, что нечисловые свойства options должны соответствоватьна имена и идентификаторы элементов опций.Таким образом, наиболее кросс-браузерный подход - использовать вместо этого числовые свойства.

Самый простой способ указать, какая опция выбрана в данный момент, - это использовать свойство selectedIndex select:

var optionIndicesByPlugId = {
    "1": 4,
    "2": 1,
    "3": 3,
    "4": 0,
    "5": 2
};

function switch_plug_drop_down(plug_id) {
    var selector = document.getElementById('group_1');
    selector.selectedIndex = optionIndicesByPlugId[plug_id];
}