Page scroll to bottom auto Ajax get article
The code is as follows |
Copy Code |
var _timer = {}; function delay_till_last (ID, FN, wait) { if (_timer[id]) { Window.cleartimeout (_timer[id]); Delete _timer[id]; }
return _timer[id] = window.settimeout (function () { FN (); Delete _timer[id]; }, wait); }
$ (document). Ready (function () { var ajax_url = null; $ (window). Scroll (function () { Delay_till_last (' Scroll_ajax ', function () { if ($ (window). scrolltop () >= $ (document). Height ()-$ (window). Height ()-80) {//If you don't have a bottom fixed bar you can reduce the 80 properly Ajax_url = $ (". NextPage a"). attr ("href");//A hidden a tag stores the next page to pull the link if (Ajax_url) { $.ajax ({ Type: "Get", Url:ajax_url, Success:function (data) { $ (". NextPage"). Remove (); $ (". Postlist"). Append (data); }, Error:function (data) { $ (". Postlist"). After (' <div id= ' ajax-list-error ' > articles get failed </div> '); } }); }else{ Ajax_load_hide (); $ ("#ajax-list-error"). Remove (); $ (". Postlist"). After (' <div id= ' ajax-list-error ' > All articles have been loaded, no more articles ~</div> '); } } }, 100); }); }); |
The first delay_till_last function is used to prevent repetitive triggering of events, which means that repeated content is loaded many times.
Postlist for the article Li's ul, has two notices to revise.
To transform the main loop, now put a function in the function.php.
The code is as follows |
Copy Code |
Ajax Get List function Bing_is_ajax_list () { if (Isset ($_get["Action")) && $_get["action" = = = "Ajax_list") return false; return trun; } |
Bing_is_ajax_list () can determine if it is an AJAX request and return a fake Ajax
Main loop:
The code is as follows |
Copy Code |
Wp_reset_query (); if (Have_posts ()): if (Bing_is_ajax_list ()) echo ' <ul class= ' postlist ' > '; while (Have_posts ()): The_post (); Article style, I use a function Bing_postlist_li (); Endwhile; if (Bing_is_ajax_list ()) echo ' </ul> '; Echo ' <div class= ' nextpage ' > '; Next_posts_link ("); Echo ' </div> '; endif |
Finally remember to use Bing_is_ajax_list () to judge, let the False (Ajax request) when the inclusion and the article List UL label itself to remove, only load a pile of Li