Wordpress点击加载更多帖子（解决方案）

Question

Hello All这是一个由wordpress ajax加载更多帖子的解决方案。

首先假设你有这样的部分。

    	 <section class="hightech-news-content" >
	     <div class="container">
		     	<?php
		     		$page_number = (get_query_var('paged')) ? get_query_var('paged') : 1;
					$page_link =  get_pagenum_link(9999999999);
				    $args = array('post_type' => 'post','posts_per_page' => 3,'paged'=>$page_number);
				    $the_query = new WP_Query( $args );
				    $max_page = $the_query->max_num_pages;
				?>	     
		     <div class="row news-list-row">
				<?php if ( $the_query->have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
			     <div class="col-lg-4 col-md-4 col-sm-6 hightech-news-list">
				     <div class="row hightech-news-list-row">
					    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-4 hightech-news-list-img">
					    <?php if(has_post_thumbnail()){ ?>
						    <img class="img-responsive" src="<?php echo get_the_post_thumbnail_url();?>">
						<?php }else{ ?>	    
						    <img class="img-responsive" src="<?php echo get_template_directory_uri(); ?>/images/Img-1.png">
						<?php } ?>						    
							<img class="hi_img" src="<?php echo get_template_directory_uri(); ?>/images/Hi.png">
						</div>
						<div class="col-lg-12 col-md-12 col-sm-12 col-xs-8 hightech-news-list-content">
						    <h3><?php the_title(); ?></h3>
							<p><?php echo substr(strip_tags($post->post_content), 0, 80)."...";?></p>
							<br>
							<h4><a href="<?php the_permalink();?>">> Lee verder</a></h4>
						</div>
					 </div>
				 </div>
				<?php endwhile; ?>
				<?php endif ;?>
				<div class="clear"></div>
			 </div>
			 <div class="text-center loading-img">
			 <img id="loading-img" src="<?php echo get_template_directory_uri(); ?>/images/loading.gif" >
			 </div>
			<div class="event-more">
			<a href="javascript:void(0)" id="load-more" onclick="loadMoreFun();" data-pagenumber="<?php echo $page_number; ?>" data-maxpage="<?php echo $max_page; ?>" data-pagelink="<?php echo $page_link; ?>">
			<h4><img src="<?php echo get_template_directory_uri(); ?>/images/next.png" >Bekijk de agenda</h4>
			</a>
			</div>
		 </div>
	 </section>

现在对于loadMoreFun（），我们可以添加这样的脚本。

     <script type="text/javascript">
function loadMoreFun() {
	var next_page = jQuery('#load-more').data("pagenumber");
	var max_page = jQuery('#load-more').data("maxpage");
	var next_page_url = jQuery('#load-more').data("pagelink");
	var $load_more_btn = jQuery(this);
    var request_data = jQuery(this).attr('pagenumber');
    next_page++;
    jQuery('#load-more').data('pagenumber',next_page);
	var next_link = next_page_url.replace(/\d+(\/)?$/, next_page + '$1');
	if(next_page <= max_page) {
	var post_type = 'post'; 
			$.ajax({
				type : 'POST',
				url : next_link,
			    cache: false,
			    beforeSend: function(){
			        jQuery('.loading-img').show();
			    },
			    complete: function(){
			        jQuery('.loading-img').hide();
			    },				
			success: function(response)  {
						if (jQuery(response).find('.hightech-news-list')){
							var newElems = jQuery(response).find('.news-list-row').html();
							jQuery('.news-list-row').append(newElems);
							if(next_page == max_page){
							jQuery('#load-more').text('No More News Available');
							}
						} else{
							
						}
		}
	});
	}
}
 </script>

希望它对每个人都有帮助。请让我知道另一个需要的帮助。