Функция фильтрации изотопов

У меня есть код в моем файле функций, который я использую для создания списка категорий, чтобы я мог использовать изотоп для фильтрации текущей страницы. Однако мне нужно знать, как –

Как сделать это падением и как заставить скрипт изотопа работать с ним?

Как заполнить раскрывающийся список с учетом условий / дочерних терминов текущей категории?

Это код, который я имею в виду –

function isotope_categories() { $terms = get_terms('videoscategory'); $html = '<ul id="options">'; $html .= '<li><a href="#" data-option-value="*" data-filter="*" class="selected">All items</a></li>'; foreach ($terms as $term) { $html .= "<li><a href='#' data-filter='.{$term->slug}' class='current'>{$term->name}</a></li>"; } $html .= '</ul>'; echo $html; } 

Вот сценарий, который мне нужен для работы с выпадающим и изотопным –

 <script type="text/javascript"> $(document).ready(function(){ var mycontainer = $('#isocontent'); mycontainer.isotope({ itemSelector: '.box' }); // filter items when filter link is clicked $('#options a').click(function(){ var selector = jQuery(this).attr('data-filter'); mycontainer.isotope({ filter: selector }); return false; }); }); </script> 

EDIT: я смог сделать функцию в раскрывающемся списке, используя этот код –

  function isotope_categories() { $terms = get_terms('videoscategory'); $html = '<select class="option-set clearfix" data-filter-group="leuchtenart">'; $html .= '<option value="*" data-filter-value="" class="selected">All items</option>'; foreach ($terms as $term) { $html .= "<option value='#filter-leuchtenart-{$term->slug}' data-filter-value='.{$term->slug}'>{$term->name}</option>"; } $html .= '</select>'; echo $html; } 

И я изменил js, используя следующий код, однако он не работает, и я получаю сообщение об ошибке в последней строке «SyntaxError: Illegal Character»

 <script type="text/javascript"> $(function(){ var $container = $('#isocontent'), filters = {}; $container.isotope({ itemSelector : '.boxes' }); // filter buttons jQuery('#filters select').change(function(){ var $this = $(this); // store filter value in object // ie filters.color = 'red' var group = this.attr('data-filter-group'); filters[ group ] = $this.find(':selected').attr('data-filter-value'); // console.log( $this.find(':selected') ) // convert object into array var isoFilters = []; for ( var prop in filters ) { isoFilters.push( filters[ prop ] ) } var selector = isoFilters.join(''); jQuerycontainer.isotope({ filter: selector }); return false; }); });​ </script> 

Любая помощь приветствуется, спасибо.

Solutions Collecting From Web of "Функция фильтрации изотопов"

Хорошо, мне удалось разобраться в работе. Я не смог понять мой второй вопрос,

Как заполнить раскрывающийся список с учетом условий / дочерних терминов текущей категории?

Вот как я получил падение на работу – падение –

 <?php $terms = get_terms("videoscategory"); $count = count($terms); if ( $count > 0 ){ echo "<select id='filter-select'>"; echo "<option value='*' data-filter-value='' class='selected'>All items</option>"; foreach ( $terms as $term ) { echo "<option value='.{$term->slug}'>" . $term->name . "</option>"; } echo "</select>"; } ?> <div id="filters"> <select id="filter-select2"> <option value="*" data-filter="*" class="selected">All items</option> <option value=".product" class="current">Documents</option> <option value=".videos" class="current">Videos</option> <option value=".text" class="current">Text</option> <option value=".link" class="current">Links</option> </select> </div> <div id="isocontent"> <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <?php $terms = get_the_terms( $post->ID, 'videoscategory' ); ?> <?php $post_type = get_post_type($post->ID); ?> <div class="box<?php foreach( $terms as $term ) echo ' ' . $term->slug; ?><?php echo ' '.get_post_type( $post->ID ); ?>"> // The Content </div> <?php endwhile; else: ?> <p><?php _e('Sorry, no posts matched your criteria.'); ?></p> <?php endif; ?> </div> 

Javascript –

 <script type="text/javascript"> $( function () { var $container = $('#isocontent'); $container.isotope({}) $('#filter-select,#filter-select2').change( function() { $container.isotope({ filter: this.value }); }); }); </script>