There is such a code:

<select> <option id="umor">Юмор</option> <option id="music">Музыка</option> <option id="images">Картинки</option> <option id="video">Видео</option> </select>

How to make, say, so that when you select <option id="music">Музыка</option> , only

 <div class="music"></div>

I tried:

 $("#music").click(function(){ $(".music").show(); });

Did not help.

    1 answer 1

    The change() function is used to determine the change in a select, here's an example of how you can make your logic.

    HTML:

     <select id="selectItem"> <option id="umor">Юмор</option> <option id="music">Музыка</option> <option id="images">Картинки</option> <option id="video">Видео</option> </select> <div class="container"> <div class="umor">Показываем юмор</div> <div class="music">Показываем музыку</div> <div class="images">Показываем картинки</div> <div class="video">Показываем видео</div> </div>

    Js:

     $('.umor').show(); $("#selectItem").change(function(){ $('.container').find('div').hide(); var selected = $('#selectItem option:selected').attr('id'); $('.' + selected).show(); });
    • The block is shown, but not hidden. - Roman Sokolov
    • Look at the example, maybe you need to make a container, as there, there everything is hidden. - MasterAlex