div зависимые от select становятся видимые при выборе

[runyugin]

вот они

 

[01K]

Вот так работает:

<select id="elements6f39d176-a9e7-42b5-8a9a-4953e73809d8option" name="elements[6f39d176-a9e7-42b5-8a9a-4953e73809d8][option][]">
    <option value="">-Выбрать Тип коляски-</option>
    <option value="standartnaya">Стандартная</option>
    <option value="aktivnaya">Активная</option>
    <option value="sportivnaya">Спортивная</option>
    <option value="elektricheskaya">Электрическая</option>
    <option value="mnogofunkcionalnaya">Многофункциональная</option>
    <option value="rychazhnaya">Рычажная</option>
    <option value="velo">Вело</option>
</select>
<div id="aktivnoya-pos-tech"  style="display: none;">Hello hidden content</div>
<div id="sportivnaya-pos-tech" style="display: none;">Hello hidden2</div>
<div id="elektricheskaya-pos-tech" style="display: none;">Hello3</div>
<div id="mnogofunkcionalnaya-pos-tech" style="display: none;">Hello4</div>
<div id="rychazhnaya-pos-tech" style="display: none;">Hello5</div>
<div id="velo-pos-tech" style="display: none;">Hello6</div>


<script type='text/javascript'>


document.getElementById('elements6f39d176-a9e7-42b5-8a9a-4953e73809d8option').addEventListener('change', function () {
    var style = this.value == "aktivnaya" ? 'block' : 'none';
    document.getElementById('aktivnoya-pos-tech').style.display = style;
    var style = this.value == "sportivnaya" ? 'block' : 'none';
    document.getElementById('sportivnaya-pos-tech').style.display = style;
        var style = this.value == "elektricheskaya" ? 'block' : 'none';
    document.getElementById('elektricheskaya-pos-tech').style.display = style;
    var style = this.value == "mnogofunkcionalnaya" ? 'block' : 'none';
    document.getElementById('mnogofunkcionalnaya-pos-tech').style.display = style;
    var style = this.value == "rychazhnaya" ? 'block' : 'none';
    document.getElementById('rychazhnaya-pos-tech').style.display = style;
    var style = this.value == "velo" ? 'block' : 'none';
    document.getElementById('velo-pos-tech').style.display = style;

});
</script>

В данном случае работает тогда, когда JS загрузжен уже после элементов.
А имя селекта - elements6f39d176-a9e7-42b5-8a9a-4953e73809d8option, динамичсеское или статическое?

P.S. ну и мелкая помарка "aktivnoya-pos-tech" лучше писать aktivnaya-pos-tech

 

[runyugin]

Поставил ниже, все так же)) непашет. id у селекта подгружается динамично но он неизменный.

 

[01K]

хм... а что, если скрипт поставить перед самым закрытием </body>?
Если у меня появятся ещё мысли - то отпишу/дополню.

Вы запутались в селектах. Он вверху отображается и работает:

 

[runyugin]

ага все работает сам ступил были дубли селекторов, которые перехватывали походу,

Спасибо огромное за помощь!

 

[01K]

Ну вот, отлично, на здоровье!
Для спасибо - есть лайки