Не обновляется переменная, как ее обновлять?

Question

[teski]

///////// Стандартное значение выбора/////////
select.selectedIndex = 0 ////  если 0 изменять в ручную на 1,2,3  то все  работает, а если на сайте переключаться с 0 на 1, 2,  3 то условия не работают!
///////////////////////////////////////////////


///////////// условия для выбора значение в select ////////////////////
if (select.selectedIndex == 0){
	select.style.background = 'red'
}

else if (select.selectedIndex == 1){
	select.style.background = '#1E90FF'
}

else if (select.selectedIndex == 2){
	select.style.background = '#F0E68C'
}

else if (select.selectedIndex == 3){
	select.style.background = '#008000'
}

/////////////////////////////////////////////////////////////////////////

Comments

[HexUserHex]

попробуй добавить
console.log(select.selectedIndex)

после:
select.selectedIndex = 0

дабы видеть какие значения ты сравниваешь.

[Дима Клепко]

HexUserHex, Условие работает только первое и выводит 0, а дальше при изменение значений, цифры не выводятся.

[HexUserHex]

Дима Клепко,
лучше попробуй вставь сюда хоть 'упрощенную версию' той части которая не работает... Что бы видеть именно весь код. Так тебе подскажут/помогут скорее.. .

[Дима Клепко]

HexUserHex, я не знаю как, я пробовал через сякие сайты, ну там расширение искажается (а я сайт не адаптировал) и картинки ни как не загрузить.

Answer 1

[altkov]

Я так понял, нужно чтобы при изменении выбранной опции выполнять код, а события не вижу. Создай событие:

select.onchange = function() {

///////////// условия для выбора значение в select ////////////////////
if (select.selectedIndex == 0){
  select.style.background = 'red'
}

else if (select.selectedIndex == 1){
  select.style.background = '#1E90FF'
}

else if (select.selectedIndex == 2){
  select.style.background = '#F0E68C'
}

else if (select.selectedIndex == 3){
  select.style.background = '#008000'
}

}

И проверь, точно ли value у опций равны 1, 2, 3

Answer 2

[FrelFrloich]

Можно и так.

<select class="select" name="" id="">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>

const select = document.querySelector('.select')

var num = 0
select?.addEventListener('change', (e) => {
    if (select.value.includes(1)) {
        console.log((num = 1))
    } else if (select.value.includes(2)) {
        console.log((num = 2))
    } else if (select.value.includes(3)) {
        console.log((num = 3))
    }
})

Не правильно понял, так что можно и так.