Home  >  Article  >  Web Front-end  >  Based on JQuery to automatically load more information when scrolling to the bottom of the page_jquery

Based on JQuery to automatically load more information when scrolling to the bottom of the page_jquery

WBOY
WBOYOriginal
2016-05-16 17:01:52928browse

Key code:

Copy code The code is as follows:

var stop=true;
$(window) .scroll(function(){
totalheight = parseFloat($(window).height()) parseFloat($(window).scrollTop());
if($(document).height() < = totalheight){
if(stop==true){
stop=false;
$.post("ajax.php", {start:1, n:50},function(txt){
                                                                                                                      .



HTML:

Copy code

The code is as follows:
Loading. ..
The implementation method is to compare the total height of the page and the scroll height to determine whether it has reached the bottom. If it reaches the bottom, read more content through ajax, and use before to insert it before Loading.
The stop parameter takes into account the time consuming of ajax reading and prevents events from being triggered multiple times during an ajax reading process, resulting in multiple loading of content.