Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Фильтр select на jquery (https://javascript.ru/forum/jquery/44479-filtr-select-na-jquery.html)

dsk8m 21.01.2014 18:51

Фильтр select на jquery
 
Здравствуйте. Есть код в html:
<div id="filters" class="gallery-filter">
                <select>
	         <option value="*">All</option>
                    <option value=".logo">Логотипы</option>
                    <option value=".firm">Фирменные стили</option>
                    <option value=".anim">Анимация логотипов</option>
                </select>    
</div>

<div id="gallery-items">

                <div class="gallery-item gallery-popup all logo">
                    <a href="images/01.jpg"><img src="images/01.jpg" alt="gallery-image" class="img-responsive" /></a>
                </div>

                <div class="gallery-item gallery-popup all logo">
                    <a href="images/02.jpg"><img src="images/02.jpg" alt="gallery-image" class="img-responsive" /></a>
                </div>

               <div class="gallery-item gallery-popup all firm">
                    <a href="images/03.jpg"><img src="images/03.jpg" alt="gallery-image" class="img-responsive" /></a>
                </div>

</div>


и код в JS:

$(window).load(function(){

	var $container = $('#gallery-items'),
        $select = $('#filters select');

    $container.isotope({
        itemSelector: '.gallery-item'
    });

    $select.change(function() {
        var filters = $(this).val();
;
        $container.isotope({
            filter: filters
        });
    });
})


Фильтр работает, но проблема в том, что при открытии страницы отображаются ВСЕ слои, и никак не удается добиться того, чтобы изначально видны были только элементы, к примеру, со значением ".logo".

Если в filter: filters вместо "filters" подставить "$('.logo'), то отображаются только логотипы, но select.change отказывается работать.

Подскажите, пожалуйста, как сделать активным по-умолчанию содержание пункта "Логотипы". Решение где-то на поверхности, но разобраться в jquery никак не получается :(

рони 21.01.2014 19:27

dsk8m,
4 строка html
<option value=".logo" selected="selected">Логотипы</option>

16 строка js
}).change() ;

dsk8m 21.01.2014 19:43

Цитата:

Сообщение от рони (Сообщение 293310)
dsk8m,
4 строка html
<option value=".logo" selected="selected">Логотипы</option>

16 строка js
}).change() ;

Спасибо огромное! Заработало :)


Часовой пояс GMT +3, время: 09:57.