jQuery实现下拉加载功能实例代码

时间:2021-05-26

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

<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 class='ajaxtips'><div style='font-size:2em'>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 class="content" id="showdiv">';str +='<div class="cont clearfix">';str +='<a href="url"><div class="cont_img fl">';str +='<img src='+val.imgurl+' alt="" /></div>';str += '<div class="cont_list fl"><p>'+val.sceneryname+'</p><ul class="cont_list fl">';str += '<li class="cont_list2"><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实现下拉加载功能实例代码,希望对大家有所帮助!

声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。

相关文章