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

前端技术 2023/09/08 JavaScript

本文实例讲述了jQuery实现页面滚动时动态加载内容的方法。分享给大家供大家参考。具体分析如下：

很多网站，比如twitter，京东商城首页，会在页面滚动到一定的位置时才动态加载页面内容，这样可以加快页面打开的速度，也可以节约带宽，下面的JS代码就可以帮你做到。

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程序设计有所帮助。

本文地址：https://www.stayed.cn/item/21813

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案