[英]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.