检测是否已达到最大页面数

Question

当我单击“加载更多”按钮时，我已经使用AJAX加载了更多WordPress帖子。现在，我需要获得可用的最大页面数，以便在达到最大页面数时不显示任何按钮。但是我不知道该怎么做。

这是我到目前为止所拥有的；

js

jQuery('#more:not(.loading)').click(function(){
    var page = jQuery(this).data('page');
    var new_page = page+1;
    var current = jQuery(this);

    current.addClass('loading');

    $.ajax({
        url : ajax.ajax_url,
        type : 'post',
        dataType : 'json',
        data : {
            page : page,
            action : 'load_more'
        },
        error : function(response){
            console.log(response);
        },
        success : function( response ){
            current.data('page', new_page);

            for(var i = 0; i < response.length; i++){
                var html =''+
                    '<div class="col-md-9">'+
                            '<div class="row">'+
                                '<div class="col-md-10 offset-md-1">'+
                                    '<p class="name">'+ response[i].name +'</p>'+
                                    '<p class="location">'+ response[i].area +'</p>'+
                                '</div>'+
                            '</div>'+

                            '<div class="row">'+
                                '<div class="col-md-1 p-0">'+
                                '</div>'+

                                '<div class="col-md-10">'+
                                    '<p class="testimonial">'+ response[i].review +'</p>'+      
                                '</div>'+

                                '<div class="col-md-1 p-0">'+
                                '</div>'+
                            '</div>'+
                            '<hr>'+
                        '</div>';

                jQuery('#testimonial_container').append(html);
                current.removeClass('loading');
            }


        }
    });
});

页面模板

<?php 
    $args = array(
        'post_type'         => 'customer_testimonial',
        'posts_per_page'    => 2,
        'orderby'           => 'date'
    );

    $query = new WP_Query( $args );
?>

<section id="testimonials_page">
    <div class="container">
        <?php if( $query->have_posts() ): ?>
            <?php $count = 0; ?>

            <div class="row" id="testimonial_container">
                <?php while( $query->have_posts() ): $query->the_post(); ?>
                    <div class="col-md-9">
                        <div class="row">
                            <div class="col-md-10 offset-md-1">
                                <p class="name"><?php the_field('customer_name'); ?></p>
                                <p class="location"><?php the_field('area'); ?></p>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-1 p-0">
                                <img src="<?php bloginfo('template_directory'); ?>/imgs/quotation.svg" class="left_quotation" alt="quotation mark image">
                            </div>

                            <div class="col-md-10">
                                <p class="testimonial"><?php the_field('review'); ?></p>                
                            </div>

                            <div class="col-md-1 p-0">
                                <img src="<?php bloginfo('template_directory'); ?>/imgs/quotation.svg" class="right_quotation" alt="quotation mark image">
                            </div>
                        </div>

                        <hr>
                    </div>
                    <?php 
                        $count = $count + 1; 

                        if($count == 1): 
                    ?>
                        <div class="col-md-3">
                            <a id="review_btn" href="#">Submit your review</a>
                        </div>

                    <?php endif; ?>
                <?php endwhile; ?>
            </div>
        <?php wp_reset_query(); ?>

        <?php endif; ?>
    </div>

    <div class="container">
        <div class="row">
            <div class="col-9 justify-content-col-center">
                <a href="javascript:;" id="more" data-page="1">
                    <span id="btn_icon"><img src='<?php bloginfo('template_directory'); ?>/imgs/preloader.gif' alt='Preloader Icon'></span>
                    <span>Load More</span>
                </a>
            </div>
        </div>
    </div>
</section>  

加载更多帖子php函数

<?php
    add_action('wp_ajax_nopriv_load_more', 'load_more');
    add_action('wp_ajax_load_more', 'load_more');

    function load_more(){

        $paged = $_POST["page"]+1;

        $args = array(
            'post_type'         => 'customer_testimonial',
            'posts_per_page'    => 2,
            'paged'             => $paged,
            'orderby'           => 'date'
        );

        $query = new WP_Query( $args );

        if( $query->have_posts() ):
            while( $query->have_posts() ): $query->the_post(); 
                $result[] = array(
                    "name"  =>  get_field('customer_name'),
                    "area"  =>  get_field('area'),
                    "review"    => get_field('review')
                );
            endwhile; 
        endif;
        echo json_encode($result);
        wp_reset_postdata();
        die();
    }
?>

Answer 1

首先使用load_more()函数-$no_of_posts = $query->found_posts;获取帖子总数，并将其传递给AJAX结果。然后，您可以通过与已经返回的帖子进行比较来隐藏“加载更多”按钮。这是完整的代码给您。

functions.php

add_action('wp_ajax_nopriv_load_more', 'load_more');
add_action('wp_ajax_load_more', 'load_more');

function load_more(){

    $paged = $_POST["page"]+1;

    $args = array(
        'post_type'         => 'customer_testimonial',
        'posts_per_page'    => 2,
        'paged'             => $paged,
        'orderby'           => 'date'
    );

    $query = new WP_Query( $args );

    $no_of_posts = $query->found_posts;
    $result['count'] = $no_of_posts;

    if( $query->have_posts() ):
        while( $query->have_posts() ): $query->the_post(); 
            $result['data'][] = array(
                "name"  =>  get_field('customer_name'),
                "area"  =>  get_field('area'),
                "review"    => get_field('review')
            );
        endwhile; 
    endif;

    echo json_encode($result);
    wp_reset_postdata();
    die();
}

模板文件脚本

<script>
    jQuery('#more:not(.loading)').click(function(){
    var page = jQuery(this).data('page');
    var new_page = page+1;
    var current = jQuery(this);
    var no_of_posts=0;

    current.addClass('loading');

    $.ajax({
        url : ajax.ajax_url,
        type : 'post',
        dataType : 'json',
        data : {
            page : page,
            action : 'load_more'
        },
        error : function(response){
            console.log(response);
        },
        success : function( response ){
            current.data('page', new_page);
            no_of_posts=response.count;

            for(var i = 0; i < response.data.length; i++){
                var html =''+
                    '<div class="col-md-9">'+
                            '<div class="row">'+
                                '<div class="col-md-10 offset-md-1">'+
                                    '<p class="name">'+ response.data[i].name +'</p>'+
                                    '<p class="location">'+ response.data[i].area +'</p>'+
                                '</div>'+
                            '</div>'+

                            '<div class="row">'+
                                '<div class="col-md-1 p-0">'+
                                '</div>'+

                                '<div class="col-md-10">'+
                                    '<p class="testimonial">'+ response.data[i].review +'</p>'+      
                                '</div>'+

                                '<div class="col-md-1 p-0">'+
                                '</div>'+
                            '</div>'+
                            '<hr>'+
                        '</div>';

                jQuery('#testimonial_container').append(html);
                current.removeClass('loading');

                if((eval(new_page)*2) >= eval(no_of_posts))
                    jQuery('#more').hide();
            }
        }
    });
});
</script>