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

Учитывая следующую функцию 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 (сгенерированный cs-cart)

 

Это отлично работает в 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, а значение в выбранном.

1
задан Community 23 May 2017 в 11:55
поделиться

1 ответ

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

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

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];
}
2
ответ дан 2 September 2019 в 21:45
поделиться
Другие вопросы по тегам:

Похожие вопросы: