wordpress实现文章的ajax无限加载- 技术经验 -卓越飞翔博客

刚学习wordpress 写下一个网站的文章的无穷读取，本来想的不好容易啊，但是真的自己写了之后感觉真的挺简单的，所以啊一定要做一下小小的总结：

首先你必须确认你的wordpress的jQuery功能能用你可以在header.php里wp_head();前面加上wp_enqueue_script('jquery'); 一定必须在他的前面，这加载的就是wordpress自带的jQuery，也可以加载自己的，方法就不必我说道了。然后就是要写下AJAX异步调用了。不过我还真的对ajax不太熟悉。不过别人写下的方法借予了一下。

首先：在你必须同时实现无限加载的也两面加入ajax代码：


/*
* jquery scroll ajax load more post
*/
var count=-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(' loading.......

add_action('wp_ajax_ajaxLoadMore','ajaxLoadMore'); add_action('wp_ajax_nopriv_ajaxLoadMore','ajaxLoadMore'); function ajaxLoadMore(){ $amount = @$_POST['amount']; $count = @$_POST['count_']; global $wpdb; $sql = "SELECT ID,post_title,post_name from lasv_posts WHERE post_status='publish' AND post_type='post' ORDER BY post_date DESC LIMIT $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($rs as $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-width wp-post-image img-buy-s-".$p_id , 'title' => $title, ); // Post thumbnail. // video img type: default , hqdefault , mqdefault , sddefault , maxresdefault //get_the_post_thumbnail($p_id,'medium' , $attr ); $img_path = get_video_img_path($p_id,'mqdefault'); $img= ''; $arrList[] = array( 'ID' => $p_id , 'title' => $title , 'img' => $img , 'url' => $url , //'end' => $end, 'count'=>$count, ); } echo json_encode($arrList ); exit; }

相关推荐