手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >jQuery实现下拉加载功能实例代码
jQuery实现下拉加载功能实例代码
摘要:废话不多说了,直接给大家贴代码了,具体代码如下所示:varstr='';if(page=="")page=1;varstop=true;//...

废话不多说了,直接给大家贴代码了,具体代码如下所示:

<script> var str = ''; if(page=="") page=1; var stop=true;//触发开关,防止多次调用事件 $(window).scroll( function(event){ //当内容滚动到底部时加载新的内容 100当距离最底部100个像素时开始加载. if ($(this).scrollTop() + $(window).height() + 10 >= $(document).height() && $(this).scrollTop() > 10) { //if(stop==true){ //stop=false; //var canshu="page/"+page+"; var url = ""; var parm = {'page':page}; page=page+1;//当前要加载的页码 //加载提示信息 $("#showlists").append("<li><div>Loding…..</div><>"); $.post(url,parm,function(data){ if( data.count == 0 ) { $('.prolist-abtn').html('已全部加载完'); return; } $.each(eval(data), function(data, val) { var url1 = ""; $(".ajaxtips").hide(); str = '<div id="showdiv">'; str +='<div>'; str +='<a href="url"><div>'; str +='<img src='+val.imgurl+' alt="" /></div>'; str += '<div><p>'+val.sceneryname+'</p><ul>'; str += '<li><span>¥</span>'; str +='<strong>'+val.sellerprice+'</strong>起<i>¥'+val.sellerprice+'</i></li>'; str +='</ul></div></a></div></div>'; $("#showdiv").append(str);//把新的内容加载到内容的后面 }); stop=true; },'JSON') } }); </script>

以上代码是小编给大家分享的jQuery实现下拉加载功能实例代码,希望对大家有所帮助!

【jQuery实现下拉加载功能实例代码】相关文章:

jQuery实现自动滚动到页面顶端的方法

jQuery实现div随意拖动的实例代码(通用代码)

jQuery聚合函数实例

js实现简单锁屏功能实例

JQuery球队选择实例

如何使用PHP+jQuery+MySQL实现异步加载ECharts地图数据(附源码下载)

jQuery实现的多屏图像图层切换效果实例

jQuery预加载图片常用方法

JQuery实现动态添加删除评论的方法

jQuery实现不断闪烁文字的方法

精品推荐
分类导航