簡體   English   中英

Ajax 加載更多 - 如果沒有更多內容,則隱藏按鈕

[英]Ajax load more - hide button if no more content

我有一個 WordPress 查詢(自定義帖子類型),並希望用戶使用“加載更多”按鈕(Ajax)加載更多文章。 為了在沒有更多帖子時隱藏加載更多按鈕,我添加了一個“else if”功能:

var ajaxurl = "<?php echo admin_url( 'admin-ajax.php' ); ?>";
var page = 2;
$('.loading').hide();
jQuery(function($) {
$('body').on('click', '.loadmore', function(e) {
    $('.loadmore').hide();
    $('.loading').show();
    var data = {
        'action': 'load_posts_by_ajax',
        'page': page,
        'security': '<?php echo wp_create_nonce("load_more_posts"); ?>'
    };

    $.post(ajaxurl, data, function(response) {
        if(response != '') {
            $('.ajax-posts').append(response);
            $('.loadmore').show();
            $('.loading').hide();
            page++;
        } else if(response == 0) {
            $(".ajax-posts").append("No More Records Found");
            $('.loading').hide();
        }
    });
});
});

問題是該按鈕僅在單擊時隱藏:

} else if(response == 0) {

但是我想在沒有更多帖子加載時自動隱藏按鈕。 所以我必須做類似的事情

} else if(response == 'last posts to load') {

知道怎么做嗎?

編輯 - 這是查詢:

add_action('wp_ajax_load_posts_by_ajax', 'load_posts_by_ajax_callback');
add_action('wp_ajax_nopriv_load_posts_by_ajax', 
'load_posts_by_ajax_callback');

function load_posts_by_ajax_callback() {
check_ajax_referer('load_more_posts', 'security');
$date_now = date('Y-m-d H:i:s');
$paged = $_POST['page'];
$args = array(
    'posts_per_page'    => 2,
    'post_type'         => 'termin',
    'meta_query'        => array(
        'key'           => 'end_date',
        'compare'       => '>=',
        'value'         => $date_now,
        'type'          => 'DATETIME'
    ),
    'orderby'           => 'end_date',
    'order'             => 'ASC',
    'meta_type'         => 'DATE',
    'post_status'       => 'publish',
    'paged' => $paged,
);
$my_posts = new WP_Query( $args );
if ( $my_posts->have_posts() ) :
    ?>
    <?php while ( $my_posts->have_posts() ) : $my_posts->the_post(); ?>

    <?php include(get_template_directory().'/termine-ajax.php'); ?>

    <?php endwhile; ?>
    <?php
endif;

wp_die();
}

我知道這是 2 年前,但我剛剛遇到同樣的問題並解決了它。 Wordpress 具有最大頁碼功能。 你可以用那個。 但首先,您需要使用按鈕在頁面上重復循環參數。 第 1 步僅將您的 args 設置為一個函數,沒有分頁部分(否則會出現錯誤)。

function ajax_args() {
$date_now = date('Y-m-d H:i:s');
$paged = $_POST['page'];
$args = array(
'posts_per_page'    => 2,
'post_type'         => 'termin',
'meta_query'        => array(
    'key'           => 'end_date',
    'compare'       => '>=',
    'value'         => $date_now,
    'type'          => 'DATETIME'
),
'orderby'           => 'end_date',
'order'             => 'ASC',
'meta_type'         => 'DATE',
'post_status'       => 'publish',
'paged' => $paged,
);

return $args;
}

第 2 步 - 調整您的 load_posts_by_ajax_callback() 函數以加載前一個函數並將分頁部分添加到其中

function load_posts_by_ajax_callback() {

check_ajax_referer('load_more_posts', 'security');

$paged = $_POST['page'];
$args = ajax_args();
$args += array('paged' => $paged,);

$my_posts = new WP_Query( $args );
if ( $my_posts->have_posts() ) :
?>
<?php while ( $my_posts->have_posts() ) : $my_posts->the_post(); ?>

<?php include(get_template_directory().'/termine-ajax.php'); ?>

<?php endwhile; ?>
<?php
endif;

wp_die();

}

然后第 3 步 - 使用您的 ajax 代碼所在的位置,您可以再次調用原始循環(無需重復自己,這就是我們將其設置為單獨函數的原因)並使用 $loop->max_num_pages 從中獲取最大頁面; 並使用帶有 page 變量的 if 語句將其隱含到 ajax 中。 例如 if(page == max_num_pages; ?>) 在響應內部和頁面之前++

<?php $paged = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1;

$args = ajax_args();

$args  += array(
    'paged' => $paged,
);

$loop = new WP_Query($args); 
$last_page = $loop->max_num_pages;
?>

var ajaxurl = "<?php echo admin_url( 'admin-ajax.php' ); ?>";
var page = 2;
$('.loading').hide();
jQuery(function($) {
$('body').on('click', '.loadmore', function(e) {
$('.loadmore').hide();
$('.loading').show();
var data = {
    'action': 'load_posts_by_ajax',
    'page': page,
    'security': '<?php echo wp_create_nonce("load_more_posts"); ?>'
};

$.post(ajaxurl, data, function(response) {
    if(response != '') {
        $('.ajax-posts').append(response);
        $('.loadmore').show();
        $('.loading').hide();

if(page == <?php echo $last_page; ?>) {

            $('.loadmore').hide(); 
  }
        page++;

    } else if(response == 0) {
        $(".ajax-posts").append("No More Records Found");
        $('.loading').hide();
    }
  });
 });
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM