使用WordPress实现文章的Ajax无限加载功能
WordPress实现文章的ajax无限加载可以通过以下步骤完成： 1. 首先，在主题的functions.php文件中添加一个名为“load_more”的函数。 2. 然后，在该函数中，使用wp_query()函数获取下一页的文章。 3. 接着，使用wp_send_json_success()函数将获取到的文章数据发送给前端。 4. 最后，在前端页面中使用jQuery监听滚动事件，当滚动到底部时调用load_more()函数来加载下一页的文章。
刚学习wordpress 写一个网站的文章的无限加载，本来想的好难啊，但是真的自己写了之后感觉真的挺简单的，所以啊一定要做一下小小的总结：
首先你要确定你的wordpress的jQuery功能能用你可以在header.php里wp_head();前面加上wp_enqueue_script('jquery'); 一定要在他的前面，这加载的是wordpress自带的jQuery，也可以加载自己的，方法就不用我说了。然后就是要写AJAX异步调用了。不过我还真的对ajax不太熟悉。不过别人写的方法借用了一下。
首先：在你要实现无限加载的也面加入ajax代码：
<scripttype="text/javascript">/**jqueryscrollajaxloadmorepost*/varcount=-10;initOne=true;jQuery(document).ready(function(){if(initOne){ajaxLoadMose(10);}});stop=true;jQuery(document).scroll(function(){totalHeight=parseFloat(jQuery(window).height())+parseFloat(jQuery(window).scrollTop());if(jQuery(document).height()<=totalHeight+560){if(stop&&!(initOne)){stop=false;jQuery('#main-list').append('<divclass="bottom-loadingloading"align="center">loading.......</div>');setTimeout(function(){ajaxLoadMose(10);},100);}}});functionajaxLoadMose(num){count+=num;jQuery.ajax({type:'post',url:'/wp-admin/admin-ajax.php',dataType:"json",data:{action:'ajaxLoadMore',amount:num,count_:count},success:function(data){if(data.length){vartotal=parseInt(jQuery('#main-list').attr('data-count'))+data.length;jQuery('#main-list').attr('data-count',total);for(i=0;i<data.length;i++){p=data[i];//alert(p['count']+"本来就有的数据数目");varoutHtml='<articleid="post-'+p['ID']+'">';outHtml+='<headerclass="entry-header">';outHtml+='<h2class="entry-title"><ahref="'+p['url']+'"rel="bookmark"title="'+p['title']+'">'+p['title']+'</a></h2>';outHtml+='<inputtype="hidden"id="post_url_hidden_'+p['ID']+'"name="post_url_hidden"value="'+p['url']+'">';outHtml+='</header>';outHtml+=p['img'];outHtml+='</article>';jQuery('#main-list').append(outHtml);vararticle=jQuery(outHtml).hide();//jQuery('#main-list').append(article);article.fadeIn('fast');}initOne=false;stop=true;jQuery('#main-list').removeClass('bottom-loadingloading');if(jQuery('.bottom-loading').length>0){jQuery('.bottom-loading').remove();}if(data.length<num){if(jQuery('.bottom-loading').length>0){jQuery('.bottom-loading').remove();}jQuery('#main-list').append('<divclass="the-end"align="center">End</div>');stop=false;}}else{}},error:function(){console.log("error");}});}</script>然后在function.php 中加入function
add_action('wp_ajax_ajaxLoadMore','ajaxLoadMore');add_action('wp_ajax_nopriv_ajaxLoadMore','ajaxLoadMore');functionajaxLoadMore(){$amount=@$_POST['amount'];$count=@$_POST['count_'];global$wpdb;$sql="SELECTID,post_title,post_namefromlasv_postsWHEREpost_status='publish'ANDpost_type='post'ORDERBYpost_dateDESCLIMIT$count,$amount";$rs=$wpdb->get_results($sql);query_posts(array('paged'=>$amount));if(have_posts()):while(have_posts()):the_post();get_template_part('content','index');endwhile;else://get_template_part('content','none');endif;$arrList=array();foreach($rsas$k){$p_id=$k->ID;$title=get_post($p_id)->post_title;$url=get_post($p_id)->post_name;$img='';$attr=array('class'=>"attachment-twentyfourteen-full-widthwp-post-imageimg-buy-s-".$p_id,'title'=>$title,);//Postthumbnail.//videoimgtype:default,hqdefault,mqdefault,sddefault,maxresdefault//get_the_post_thumbnail($p_id,'medium',$attr);$img_path=get_video_img_path($p_id,'mqdefault');$img='<ahref="'.$url.'.html"class="img-a"><spanclass="'.show_post_style($p_id).'"></span></span><imgsrc="'.$img_path.'"></a>';$arrList[]=array('ID'=>$p_id,'title'=>$title,'img'=>$img,'url'=>$url,//'end'=>$end,'count'=>$count,);}echojson_encode($arrList);exit;}前面的add_action();必不可少这个方法主要写要返回前台数据。
这就可以了还有网页上要有div id 为main-list就可以了
