如何使用jquery使wordpress post循环并替换html输出？

Question

在我的wordpress站点中，我有一个包含3个部分的页面。每个部分都包含来自特定类别的帖子。我使用这个wordpress查询来获取该类别中的最新3篇文章，并将其加载到它的部分(Div)中。因此，对于“小说”部分，我使用以下查询：

<? $novels = get_option('of_novels') ?>
<?php $paged = (get_query_var('paged')) ? get_query_var('paged') : 1; query_posts('category_name=$novels&posts_per_page=3'); ?>
<?php while (have_posts()) : the_post(); ?>
    <div class="sliderunit">
        <?php the_post_thumbnail(); ?>
        <div class="novelsslidertitle">
            <div class="arrow-left"></div>
            <a href="<?php the_permalink(); ?>"><img class="cross" src="<?php bloginfo('stylesheet_directory'); ?>/images/cross.png"/></a>
            <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
            <h3>رواية</h3>
        </div>
    </div>                    
<?php endwhile;?>

这让我在#小说类别中得到了最新的3篇文章。现在，我有一些按钮。我想要编写一些jequery来在这个类别上循环，并获得上一篇和下一篇文章，并将新的查询内容重新加载到#novels div中，用以下命令替换html中的旧查询代码

$("<div/>").replaceWith("// Replace with a function to get the code of new output");

在不使用分页和重新加载页面的情况下充当滑块？我希望我的问题被很好地声明，我感谢任何有用的线索，链接或参考。

Answer 1

我不认为$.replaceWith是你在这里真正需要的。你只需要监听用户何时到达某个点，可能是当前加载的帖子中的最后一个，或者倒数第二个，然后运行$.ajax()或类似的查询，将其附加到您的#sliderunit，它将使您能够继续滚动/滑动。通过添加而不是替换，您可以根据需要来回切换，而不必重新加载任何内容。如果您关心内存管理，那么可以在某个阈值下使用$.remove()。

如果你需要更多关于如何做到这一点的信息，首先附加你的新数据，然后使用CSS操作，如$.animate()来执行幻灯片效果。你可以使用层来隐藏你不想显示的东西，或者我猜你也可以在你不想显示的块上调用$.hide()。