如何在 wordpress 中 ajax 下一个/上一个帖子？答案

【问题标题】：How to ajax next/previous posts in wordpress?如何在 wordpress 中 ajax 下一个/上一个帖子？
【发布时间】：2012-11-15 23:58:50
【问题描述】：

好的，我一直在这里做一些研究，但我不确定如何解决这个问题，因为大多数 ajax 和 wordpress 主题似乎与我的不同。我几乎有一个网站

http://dev.touch-akl.com/childsplay/

在博客部分，它显示了三个最新的博客，其中包含我想在接下来的 3 个使用 ajax 的帖子中加载的更多内容链接。

我的jQuery如下

loadPosts();

function loadPosts(){

        var $loadBtn = $('.ajax-load a');
        var $loadCont = $('#ajax-content');
        var pageTitle = document.title;


        $loadBtn.live("click",function(e){
            e.preventDefault();

            var sourceTarget = '#ajax-content .the-posts';
            $this = $(this);
            pageUrl=$this.attr('href');

            $loadCont.fadeTo(500,0);

            $loadCont.load(pageUrl+" "+sourceTarget, function(){

                $loadCont.fadeTo(500,1);

                        if(window.history.replaceState){
                     document.title = pageTitle;
                     window.history.replaceState(null, pageTitle, pageUrl);
                   }                                

                        //loadJQUERY(sourceTarget);
            }); // end ajax load    

        });     // end click function

}

和 html

        <div id="ajax-content">
            <div class="the-posts">

                <?php
                // START A QUERY OF THE NEWS ITEM POSTS AND LOOP THAT THANGGGG
                if ( get_query_var('paged') ) $paged = get_query_var('paged');  
                if ( get_query_var('page') ) $paged = get_query_var('page');

                query_posts('posts_per_page=3&paged=' . $paged);

                if (have_posts()) : while (have_posts()) : the_post(); ?>   

                    <article class="three columns">
                        <h3>The Most Recent Post</h3>
                        <img class="blog-image" src="<?php bloginfo('template_url');?>/images/blog/blogs-post.jpg" alt="Childsplay">
                        <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text.</p>
                        <a href="#">Read More</a>
                    </article>

            <?php endwhile; ?>

                    <div class="navigation">
                        <span class="left ajax-load"><? previous_posts_link('&larr; More Stuff') ?></span>
                        <span class="right ajax-load"><? next_posts_link('More Stuff &rarr;') ?></span>
                    </div>      

            <?php else : endif; ?> 
            <?php wp_reset_query(); // reset the query ?>   

        </div>
    </div>

即使永久链接设置为 wordpress 下一篇文章按钮的默认值，它似乎也找不到该页面。

我的 ajax 方式对 wordpress 不是很好吗？我见过人们使用其他方式，但我不太了解。

【问题讨论】：

我在控制台收到这条消息 GET dev.touch-akl.com/childsplay/page/2/.the-posts
您是否在页面加载时收到前 3 个帖子？
是的。此外，当单击“更多内容”按钮时，网址将切换到第 2 页，然后我可以刷新页面并进入下一个内容，然后如果您单击后退箭头，帖子将起作用。
我在尝试加载帖子时收到 404 Not Found 错误。想知道我的问题是否也与这些家伙相似？ stackoverflow.com/questions/3445270/…

标签： ajax wordpress jquery

【解决方案1】：

如果你想考虑使用插件，那么有很多。这是我迄今为止发现的。也许这会对你有所帮助这是一步一步的过程http://www.mygeekpal.com/creating-an-ajax-powered-pagination-in-wordpress/

这个也不错，但概念不同http://wordpress.org/extend/plugins/ajax-pagination/screenshots/

【讨论】：

两个链接现在都失效了，