jQuery实现滚动时动态加载页面内容

Posted 起个名字好难

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery实现滚动时动态加载页面内容相关的知识,希望对你有一定的参考价值。

原文:http://www.open-open.com/code/view/1446693988935

 

有些网站的网页内容不是一次性加载完毕的,而是在鼠标向下滚动时动态加载的,这是怎么做到的呢?看下面代码:

var loading = false;
$(window).scroll(function(){
 if((($(window).scrollTop()+$(window).height())+250)>=$(document).height()){
      if(loading == false){
           loading = true;
           $(‘#loadingbar‘).css("display","block");
           $.get("load.php?start="+$(‘#loaded_max‘).val(), function(loaded){
                $(‘body‘).append(loaded);
                $(‘#loaded_max‘).val(parseInt($(‘#loaded_max‘).val())+50);
                $(‘#loadingbar‘).css("display","none");
                loading = false;
           });
      }
 }
});

$(document).ready(function() {
 $(‘#loaded_max‘).val(50);
});

以上是关于jQuery实现滚动时动态加载页面内容的主要内容,如果未能解决你的问题,请参考以下文章

滚动到页面底部 100px 时,jQuery 加载内容,触发多个事件

jQuery:实现图片按需加载的方法,当要显示内容的高度超过了页面的高度,按需加载,根据滚动条的位置来判断页面显示的内容

几条jQuery代码片段助力Web开发效率提升

没有滚动内容时如何下拉协调器布局

页面滚动图片等元素动态加载插件jquery.scrollLoading.js

jquery easyui datagrid在进行初始化页面加载的时候,如何数据没有加载完毕,动态加载数据.