Question

我正在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查找了一些内容，但我对此没有任何经验。这样做最好的方法是什么？

Answer 1

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

<?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());
}

希望有所帮助

WP - 当列表中的标题被选中时，将帖子的内容加载到空div中

1 个答案: