循环使用WordPress中的类别

时间:2015-05-11 16:46:34

标签: php html css wordpress loops

我有很多产品,勾选后会以不同的类别显示。

现在,我想要实现的是,根据点击的类别显示某些图像。

示例

如果我点击类别A,则会显示图像(A)。

我这样做的代码如下所示。

<?php if ( $query->have_posts() ) : while ( $query->have_posts() ) : $query->the_post(); ?>

    <?php 
    $terms = wp_get_post_terms( get_the_id(), 'type' );
    $term_class = '';
    if ( isset( $terms[0] ) ) {

        $term_class = $terms[0]->slug;
    }
    ?>
<ul>
            <li class="linoheight" style="margin-left:45px !important;"><img class="<?php echo $term_class; ?>-new" src="<?php bloginfo('stylesheet_directory'); ?>/images/acoustic-icon-small.png" alt="" width="30px" height="30px" style="display:none;"></li>
            <li class="linoheight"><img class="<?php echo $term_class; ?>-new" src="<?php bloginfo('stylesheet_directory'); ?>/images/hard-wired-icon-small.png" alt="" width="30px" height="30px" style="display:none;"></li>
            <li class="linoheight"><img class="<?php echo $term_class; ?>-new" src="<?php bloginfo('stylesheet_directory'); ?>/images/radio-icon-small.png" alt="" width="30px" height="30px" style="display:none;"></li>
        </ul>

因此,这将获得所选的复选框,然后创建类&class;类别A-new。

在CSS中,此类别将显示:block,显示图标。

现在,我遇到的问题是<?php echo $term_class;?>-new只获得其中一个类别,这意味着如果选择了类别A,则类别B和C仍然显示图像。

我感觉这是循环的问题,有没有人有任何想法?

1 个答案:

答案 0 :(得分:0)

你需要隐藏并显示对象,如果onclick然后该项的唯一ID应传递给某个jquery或javascript函数,他们将显示该项目,例如, 如果我有

  • 第1项
  • 第2项
  • 第3项

这三个字段都有唯一的id,s就像 对于1- 2-等你需要使用jquery命中这样的方法之后在ul中放置一些唯一的id,就像先在li,s之间找到它一样:

$("#list-of-items li").click(function(){

    var current_clicked_li_index = $(#list-of-items li).index(this);

   // now use .each loop in jquery

$("#list-of-items li img").each(function( Loopindex ) {


   if(current_clicked_li_index != Loopindex){

      $(this).hide();

   }else{

    $(this).show();

   }

});   

});

注意:不要忘记使用jquery库。