加载更多帖子Ajax按钮



我使用ajax来"加载更多的帖子";一切都正常,但当适当类别的帖子结束时,按钮会无休止地加载随机帖子。。。我在哪里犯错误?

当功能找不到当前类别中的帖子时,可能有一些方法可以结束/禁用按钮?

functions.php

function more_post_ajax(){
$ppp = (isset($_POST["ppp"])) ? $_POST["ppp"] : 3;
$page = (isset($_POST['pageNumber'])) ? $_POST['pageNumber'] : 0;
$cat = (isset($_POST['cat'])) ? $_POST['cat'] : '';
header("Content-Type: text/html");
$args = array(
'suppress_filters' => true,
'post_type' => 'post',
'posts_per_page' => $ppp,
'cat' => $cat,
'paged'    => $page,
);
$loop = new WP_Query($args);
$out = '';
if ($loop -> have_posts()) :  while ($loop -> have_posts()) : $loop -> the_post();
$out .= '<div class="small-12 large-4 columns">
<h1>'.get_the_title().'</h1>
<p>'.get_the_content().'</p>
</div>';
endwhile;
endif;
wp_reset_postdata();
die($out);
}
add_action('wp_ajax_nopriv_more_post_ajax', 'more_post_ajax');
add_action('wp_ajax_more_post_ajax', 'more_post_ajax');

main.js

var ppp = 3; // Post per page
var cat = $('#more_posts').data('category');
var pageNumber = 1;

function load_posts(){
pageNumber++;
var str = '&cat=' + cat + '&pageNumber=' + pageNumber + '&ppp' + ppp + '&action=more_post_ajax';
$.ajax({
type: "POST",
dataType: "html",
url: ajax_posts.ajaxurl,
data: str,
success: function(data){
var $data = $(data);
if($data.length){
$("#ajax-posts").append($data);
$("#more_posts").attr("disabled",false);
} else{
$("#more_posts").attr("disabled",true);
}
},
error : function(jqXHR, textStatus, errorThrown) {
$loader.html(jqXHR + " :: " + textStatus + " :: " + errorThrown);
}
});
return false;
}
$("#more_posts").on("click",function(){ // When btn is pressed.
$("#more_posts").attr("disabled",true); // Disable the button, temp.
load_posts();
});

单一类别.php

<div id="ajax-posts" class="row">
<?php
$cat = get_queried_object();
$postsPerPage = 3;
$args = array(
'post_type' => 'post',
'posts_per_page' => $postsPerPage,
'cat' => $cat ->term_id,
);
$loop = new WP_Query($args);
while ($loop->have_posts()) : $loop->the_post();
?>
<div class="small-12 large-4 columns">
<h1><?php the_title(); ?></h1>
<p><?php the_content(); ?></p>
</div>
<?php
endwhile;
wp_reset_postdata();
?>
</div>
<div class="btn" id="more_posts" data-category="<?php echo $cat_id; ?>">>Load More</div>

footer.php脚本

<script type="text/javascript">
jQuery(document).ready( function($) {
var ajaxUrl = "<?php echo admin_url('admin-ajax.php')?>";

// What page we are on.
var page = 5; 
// Post per page
var ppp = 3; 
$("#more_posts").on("click", function() {
// When btn is pressed.
$("#more_posts").attr("disabled",true);
// Disable the button, temp.
$.post(ajaxUrl, {
action: "more_post_ajax",
offset: (page * ppp) + 1,
ppp: ppp
})
.success(function(posts) {
page++;
$("#ajax-posts").append(posts);
// CHANGE THIS!
$("#more_posts").attr("disabled", false);
});
});
});
</script>

您可以在ajax中添加开始值和限制值并从php页面接收它们并将其放入查询中我有一个显示用户评论的预编码,你可以根据自己的意愿修改

主页

<script>
$(document).ready(function(){
var limit = 5;
var start = 0;
var status = false;
function load_comments(limit, start){
$.ajax({
url:"view_comments.php",
method:"POST",
data:{limit:limit,start:start},
cache:false,
success:function(data){
$('#load_comments').append(data);
if(data == ''){
$('#load_comm_info').html("<div>That's all comments</div>");
status = true;
}else{
$('#load_comm_info').html("<button type='button'>Load more comments</button>");
status = false;
}
}
});
}
if(status == false){
status = true;
load_comments(limit, start);
}
$("#load_comm_info").click(function(){
if(status == false){
status = true;
start = start + limit;
setTimeout(function(){
load_comments(limit, start);
}, 1000);
}
});
});
</script>

这是页面view_comments.php

<?php
if(isset($_POST["start"], $_POST["limit"])){
$start = $_POST['start'];
$limit = $_POST['limit'];
$get_comments = mysqli_prepare($dmgsf_connect, "SELECT * FROM `comments` ORDER BY `id` DESC LIMIT ?, ?");
mysqli_stmt_bind_param($get_comments, 'ii',$start,$limit);
mysqli_stmt_execute($get_comments);
$get_comments_res = mysqli_stmt_get_result($get_comments);
$get_comments_num = mysqli_num_rows($get_comments_res);
mysqli_stmt_close($get_comments);
if($get_comments_num > 0){ ?>
<?php while($get_comments_rows = mysqli_fetch_assoc($get_comments_res)){ ?>
<div>
<span><?php echo $get_comments_rows['comment'];?></span>
</div>
<?php }
} 
}
?>

最新更新