我试图通过AJAX加载帖子,但是下面的代码可以加载页面,在最初的8篇帖子之后,返回就是一切。这似乎没有道理解释为什么在页面加载时它会工作,然后后续的请求会返回这么多结果。
该查询针对同一职位类型的多个类别,类别ID是在单击某个选项卡时获得的(工作正常):
var cat = jQuery(this).attr("id");
这里有什么明显的我遗漏的吗?
//HTML
<div class="aj_load">Loading...</div>
<div id="data"></div>
//AJAX帖子(在页面上)
var pageNumber = \'1\';
function load_posts(){
var cat = jQuery("#tabs li.active").attr("id");
jQuery(".aj_load").animate({\'opacity\' : 1}, 300);
pageNumber++;
var str = \'&cat=\' + cat + \'&pageNumber=\' + pageNumber + \'&action=load_more\';
jQuery.ajax({
type: "POST",
dataType: "html",
url: ajaxurl,
data: str,
success: function(data){
var jQuerydata = jQuery(data);
if(jQuerydata.length){
jQuery(".aj_load").animate({\'opacity\' : 0}, 300);
jQuery("#data").append(jQuerydata);
}
},
error : function(jqXHR, textStatus, errorThrown) {
jQueryloader.html(jqXHR + " :: " + textStatus + " :: " + errorThrown);
}
});
return false;
}
// Run load_posts() on document load
jQuery(document).ready(function(){
load_posts();
});
// Run load_posts() on scroll
jQuery(document).on(\'scroll\', function() {
var distanceFromBottom = Math.floor(jQuery(document).height() - jQuery(document).scrollTop() - jQuery(window).height());
if(distanceFromBottom < 400) {
load_posts();
}
});
//AJAX加载更多函数(在functions.php中)
function load_more(){
$cat = $_REQUEST[\'cat\'];
$page = $_POST[\'pageNumber\'];
header("Content-Type: text/html");
$args = array(
\'cat\' => $cat,
\'post_type\' => \'post\',
\'orderby\' => \'date\',
\'order\' => \'DESC\',
\'suppress_filters\' => true,
\'posts_per_page\' => 8,
\'paged\' => $page,
);
$loop = new WP_Query($args);
if ($loop -> have_posts()) : while ($loop -> have_posts()) : $loop -> the_post();
locate_template(\'/parts/news-loop.php\', TRUE, FALSE);
endwhile; else :
echo "No More Posts";
endif;
wp_reset_postdata();
die();
}
add_action(\'wp_ajax_nopriv_load_more\', \'load_more\');
add_action(\'wp_ajax_load_more\', \'load_more\');
//循环模板
<?php
$cats = get_the_category();
$cat_slug = $cats[0]->slug;
?>
<div class="news-post">
<h2><?php the_title(); ?> - <?php the_time(\'dS F Y\') ;?></h2>
<div class="news-line"></div>
<div class="news-hex <?php echo $cat_slug; ?>"></div>
<div class="text">
<p><?php echo wp_trim_words(get_the_content(), 40, \'...\') ?></p>
<a class="more" href="<?php the_permalink(); ?>">FIND OUT MORE</a>
</div>
<div class="clear"></div>
</div>