目标和布局：

我有两个单独的div（这在自定义页面模板中）。DIV1具有指定父类别的列表子类别它现在正在工作，但它是半手动的。

Code in 1st DIV:

<?php $products = get_categories(\'child_of=1143&hide_empty=1\');
  foreach ( $products as $product ) {
  echo \'<li><a href="#" class=\'. $product->cat_ID .\'>\'.$product->cat_name.\'</a></li>\';
  } ?>

Code in 2nd DIV:

<!-- post lists -->
<ul id="list1" style="display: none;">
<?php $my_query = new WP_Query(\'category_name=lightbulbs&showposts=25&post_type=product&orderby=title&order=asc\');
while ($my_query->have_posts()) : $my_query->the_post();
$do_not_duplicate = $post->ID;?>
<li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
<?php endwhile; ?>
</ul>

<ul id="list2" style="display: none;">
<?php $my_query = new WP_Query(\'category_name=refrigerators&showposts=25&post_type=product&orderby=title&order=asc\');
while ($my_query->have_posts()) : $my_query->the_post();
$do_not_duplicate = $post->ID;?>
<li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
</ul>
</div>
<!-- / post lists -->

让一切正常运行的脚本：

• http://code.jquery.com/jquery-latest.js 在标题中加上：

                  <script>
                  $(document).ready(function() {
                      var h1 = $("#list1").height();
                      var h2 = $("#list2").height();
                      $("#list1,#list2").height(Math.max(h1, h2));
                      $("#list2").hide();
                  });
  
                  $("#link1").live(\'click\', function() {
                      $("#list1").show();
                      $("#list2").hide();
                  });
  
                  $("#link2").live(\'click\', function() {
                      $("#list2").show();
                      $("#list1").hide();
                  });
              </script>
  

I wanted to see if there\'s a way to automate the second part. 当我添加新的子类别时，它会自动列在DIV1中，但要在DIV2中显示该类别中的帖子，我必须手动a）使用新列表添加div，b）将类添加到脚本中。