我在我的函数文件中有一个代码，我正在使用它生成一个类别列表，以便我可以使用同位素来过滤当前页面。但是我需要知道如何-

如何使其成为下拉列表，以及如何使同位素脚本与之配合使用？

如何使用正在查看的当前类别的术语/子术语填充下拉列表？

这是我所指的代码-

    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：非法字符”上收到了一个错误

<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
    // i.e. 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>

非常感谢您的帮助，谢谢。

<?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>

<script type="text/javascript">
$( function () {

  var $container = $(\'#isocontent\');

  $container.isotope({})

  $(\'#filter-select,#filter-select2\').change( function() {
    $container.isotope({
      filter: this.value
    });
  });

});
</script>