简单的一句话preSS AJAX分页 [英] Simple Wordpress AJAX pagination

问题描述

我使用的是循环+ jQuery的下方，在下一集的页面加载，它适用于第一次点击，但在接下来的页面加载，我点击新帖重新加载整个页面。任何想法？

 ＆LT; D​​IV ID =内容＆GT;
    ＆LT; PHP
$ new_query =新WP_Query（）;
$ new_query-＆GT;查询（'post_type =交与放大器; showposts = 1'。'和;分页='$分页）;
？＆GT;

？＆LT; PHP而（$ new_query-＆GT; have_posts（））：$ new_query-＆GT; the_post（）; ？＆GT;
＆LT; PHP the_title（）; ？＆GT;

＆LT; PHP ENDWHILE; ？＆GT;
    ＆LT; D​​IV ID =分页＆GT;
    ＆LT; PHP next_posts_link（'和; LAQUO;旧条目'，$ new_query-＆GT; max_num_pages）？＆GT;
    ＆LT; PHP previous_posts_link（'新条目和放大器; RAQUO;'）？＆GT;
    ＆LT; / DIV＆GT;
＆LT; / DIV＆GT;＆LT;！ - ＃内容 - ＆GT;

＆LT;脚本＆GT;
$（'＃分页一'）。在（'点击'，函数（事件）{
。事件preventDefault（）;
VAR链接= $（本）.attr（HREF'）; //获取href属性
$（'＃内容）淡出（500，函数（）{}）; //淡出内容区域
$（'＃内容）负载（链接+＃内容，函数（）{}）;
$（'＃内容）淡入（500，函数（）{}）;在内容方面//褪色

}）;
＆LT; / SCRIPT＆GT;
 

解决方案

  jQuery的（功能（$）{
    $（'＃内容）。在（'点击'，'#pagination一'，函数（E）{
        即preventDefault（）;
        VAR链接= $（本）.attr（HREF'）;
        $（'＃内容）。淡出（500，函数（）{
            $（本）.load（链接+＃内容，函数（）{
                $（本）.fadeIn（500）;
            }）;
        }）;
    }）;
}）;
 

I'm using the loop + jQuery below to load in the next set of pages, and it works on the first click, but when the next page is loaded in and I click on "newer posts" it reloads the whole page. Any ideas?

<div id="content">
    <?php
$new_query = new WP_Query();
$new_query->query('post_type=post&showposts=1'.'&paged='.$paged);
?>

<?php while ($new_query->have_posts()) : $new_query->the_post(); ?>
<?php the_title(); ?>

<?php endwhile; ?>
    <div id="pagination">
    <?php next_posts_link('&laquo; Older Entries', $new_query->max_num_pages) ?>
    <?php previous_posts_link('Newer Entries &raquo;') ?>
    </div>
</div><!-- #content -->

<script>
$('#pagination a').on('click', function(event){
event.preventDefault();
var link = $(this).attr('href'); //Get the href attribute
$('#content').fadeOut(500, function(){ });//fade out the content area
$('#content').load(link + ' #content', function() { });
$('#content').fadeIn(500, function(){ });//fade in the content area

});
</script>

解决方案

jQuery(function($) {
    $('#content').on('click', '#pagination a', function(e){
        e.preventDefault();
        var link = $(this).attr('href');
        $('#content').fadeOut(500, function(){
            $(this).load(link + ' #content', function() {
                $(this).fadeIn(500);
            });
        });
    });
});

这篇关于简单的一句话preSS AJAX分页的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！