0

我正在 wordpress 中构建一个站点，其中在某个部分有一个包含帖子项目列表的容器（将其视为菜单/侧边栏），以及一个我将加载内容的空白空间。当您单击帖子列表中的一个标题时，该单击标题的内容应该加载到空 div 中。单击标题列表中的另一个标题。

所以它看起来像这样，基本上：

<div class="container">
  <ul class="cats">
     <?php
       $my_query = new WP_Query('showposts=10&cat=4');
       while ($my_query -> have_posts()) : $my_query->the_post();  $category = get_the_category(); 
     ?>

       <li class="trigger">
         <h5>
           <? the_title(); ?>
         </h5>
       </li>

     <?php 
       endwhile; wp_reset_query(); 
     ?>
  </ul>
  <div class="the-content">
    <? the_content(); ?>
  </div>
</div>

所以，我已经为ajax查找了一些东西，但我没有任何经验。最好的方法是什么？

4

1 回答 1

0

当您收到帖子时，您还可以将帖子内容存储在具有特定于帖子的 id 的隐藏 div 中。例如;

<?php
       $my_query = new WP_Query('showposts=10&cat=4');
       while ($my_query -> have_posts()) : $my_query->the_post();  $category = get_the_category();
echo '<div id="post_' . $my_query->the_post()->id . '" style="display:none;">' . $my_query->the_post()->content . '</div>'; 
 ?>

并且当您点击特定标题时，您可以从隐藏的div中获取相关的帖子内容；

<li class="trigger" onclick="showContent(this)" id="post_id">//This id must be the id of post
         <h5>
           <? the_title(); ?>
         </h5>
</li>

和javascript代码；

function showContent(obj) {
    $(".the-content").empty().html($("#" + $(obj).attr('id')).html());
}

希望能帮助到你

于 2012-11-12T10:39:32.837 回答