Wordpress / PHP / Ajax加载更多帖子

时间:2013-01-31 16:20:48

标签: php ajax wordpress

我的wordpress类别页面上有一些代码,如果他们点击图片,则会加载更多帖子 - 在这种情况下为15。

第一次按下时效果很好。但是,一旦再次按下它,它就不会引入下一组帖子(即第三组),但会引入第二组。

我明白问题是偏移 - 即。它开始的地方。因此,第一次按下时,偏移量应为16,第二次为31,第三次为46等。

然而,在遇到困难时,正在经过这个偏移。

这是js:

    $('#do-show-more-posts').live('click', function(){


    if( $(this).data("o-set")){
        $offset=$(this).data("o-set");
    }else
    {
        $offset=16 ; //assume this is 16 initially
    }

    var post_type = $(this).attr('post-type');
    var parent = $(this).attr('parent-id');
    var offset = $('.article').size();

    $(this).fadeTo(0,0);
    $('.load-more-posts-wrapper .loader').addClass('show');

    $.post( ajaxurl, { action: 'load_more_posts', post_type : post_type, parent : parent, offset : offset }, function(data){
        $load_more = $('.load-more-posts-wrapper');
        $load_more.find('.loader').removeClass('show');
        $load_more.find('.link').removeAttr('style');
        var load_more_button = '<div class="load-more-posts-wrapper">' + $load_more.html() + '</div>';
        $load_more.remove();

        if( data == '' || data == 'udefined' || data == 'No More Posts' || data == 'No $args array created' ){
            data = '';
            load_more_button = '<div class="load-more-posts-wrapper">There are no more posts.</div>';
            setTimeout("$('.load-more-posts-wrapper').fadeTo(1800,0)", 8000 );
        }

        $('#content').append( data );
        $('#content').append( load_more_button );
        $(this).data("o-set",$offset);
    });


});

这是PHP:

function load_more_posts() {




if( isset($_POST['post_type']) && $_POST['post_type'] == 'publication' ){

    $args = array(
        'offset'         => $_POST['offset'],
        'orderby'        => 'post_date',
        'order'          => 'DESC',
        'post_type'      => 'article',
        'post_status'    => 'publish',
        'meta_query'     => array(
            array(
                'key'    => 'related-publication',
                'value'  => $_POST['parent'],
                'meta_compare' => 'IN'
            )
        )
    );

} else if(isset($_POST['post_type']) && $_POST['post_type'] == 'category') {

    $args = array(
         'cat'       => $_POST['parent'],
         'offset'    => $_POST['offset'],
        'post_type' => array('post','article','publication')
     );

} else {

    // print_r($args);

}

$Query = new WP_Query( $args );
//print_r($Query);
if ( $Query->have_posts() ) {

    while ( $Query->have_posts() ) {
        $Query->the_post();
        get_template_part('loop', 'xxxry');
    }

} else {
    // print_r($args);
}

exit;
}

我有一个想法是创建一个包含偏移值的会话,尽管这似乎不起作用。此外,如果有人返回该类别页面,我不确定如何删除它。

我使用的代码是:

if (isset($_SESSION['posts_start'])){
    $_POST['offset']=$_SESSION['posts_start']+15;
    $_SESSION['posts_start']=$_POST['offset'];
} else {
    $_POST['offset']=15;
    $_SESSION['posts_start']=$_POST['offset'];
}

我把它放在php函数的开头。如果已有会议,似乎没有注册15的增加。

1 个答案:

答案 0 :(得分:2)

您可以使用WP_Query args的posts_per_pagepaged参数,而不是使用偏移量。

function load_more_posts() {

//...

    $args = array(
        'posts_per_page' => $_POST['offset'],
        'paged'          => $_POST['page'],
        'orderby'        => 'post_date',
        'order'          => 'DESC',
        'post_type'      => 'article',
        'post_status'    => 'publish',
        'meta_query'     => array(
            array(
                'key'    => 'related-publication',
                'value'  => $_POST['parent'],
                'meta_compare' => 'IN'
            )
        )
    );

//...
}

在你的JS中:

//EDIT2: (global page variable
$(document).ready(function(){
//...
var page = 1; //don't redefine this variable each time you click.
$('#do-show-more-posts').live('click', function(){
    //...
    $.post( ajaxurl, { action: 'load_more_posts', post_type : post_type, parent : parent, offset : $offset, page : page++ }, function(data){
    //EDIT:  --------------------------------------------------------------------------------------------------- ^
        $load_more = $('.load-more-posts-wrapper');
        $load_more.find('.loader').removeClass('show');
        $load_more.find('.link').removeAttr('style');
        var load_more_button = '<div class="load-more-posts-wrapper">' + $load_more.html() + '</div>';
        $load_more.remove();

    if( data == '' || data == 'udefined' || data == 'No More Posts' || data == 'No $args array created' ){
        data = '';
        load_more_button = '<div class="load-more-posts-wrapper">There are no more posts.</div>';
        setTimeout("$('.load-more-posts-wrapper').fadeTo(1800,0)", 8000 );
    }

    $('#content').append( data );
    $('#content').append( load_more_button );
    $(this).data("o-set",$offset);
    });
}
//...
}