Как сделать так, чтобы при выборе в списке был виден другой список?

Как сделать так, чтобы при выборе в списке select был виден другой список select?

Делаю фильтры на сайте, хочу, чтобы пользователь не путался в множестве списков select.

например: пользователь выбирает в списке Музыка, появляется другой select с жанрами.
или пользователь выбирает аудиокниги, появляется список с жанрами для аудиокниг.

сами списки стилизованы плагином

как быть?

привязать к div тоже не получается, код генрится javascript'ом, а с ним у меня проблемы) это можно увидеть в коде ниже)

есть такой скрипт:
<script type="text/javascript">$(document).ready(function () { $(".metamid").hide();$("#utab1").click(function(){$(".metamid").hide()});$("#utab2").click(function(){$(".metamid").show()});$("#utab3").click(function(){$(".metamid").hide()});});</script>


только он не сработает для option'ов. вроде нужно привязывать к самому списку select...
  • Вопрос задан
  • 146 просмотров
Пригласить эксперта
Ответы на вопрос 2
SV0L0Ch
@SV0L0Ch
Разработчик специализируюсь на Bitrix и Wordpress
По событию change для select надо показывать нужный.
Можно фильтровать по значению option.

Как-то так:

<select id="type">
    <option>Выбрать</option>
    <option value="muz">Музыка</option>
    <option value="book">Аудио книги</option>
</select>

<select id="muz" style="display:none">
    <option>Выбрать</option>
    <option value="">Рок</option>
    <option value="">Классика</option>
    <option>Рэп</option>
</select>

<select id="book" style="display:none">
    <option>Выбрать</option>
    <option value="">Рок</option>
    <option value="">Классика</option>
</select>

$(function(){
      $('#type').change(function () {
           $('#'+ $(this).val() ).show();
      });
});
Ответ написан
mrusklon
@mrusklon
если долго мучится - что нибудь получится
<select id="one">
    <option>Выбрать</option>
    <option>Музыка</option>
    <option>Аудио книги</option>
</select>

<select id="two" style="display:none">
    <option>Выбрать</option>
    <option>Рок</option>
    <option>Классика</option>
    <option>Рэп</option>
</select>

<select id="someid" style="display:none">
    <option>Выбрать</option>
    <option>Рок</option>
    <option>Классика</option>
    <option>Рэп</option>
</select>


$(function () {

        $('#one').change(function () {
           $('#two').show();
        });
        $('#two').change(function () {
            $('#someid').show();
        });

    });


так?
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы