Учитывая следующую функцию 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, а значение в выбранном.
Свойство 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];
}