jQuery實現下拉載入功能執行個體代碼,jquery下拉

來源:互聯網
上載者:User

jQuery實現下拉載入功能執行個體代碼,jquery下拉

廢話不多說了,直接給大家貼代碼了,具體代碼如下所示:

<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實現下拉載入功能執行個體代碼,希望對大家有所協助!

您可能感興趣的文章:
  • asp.net+jquery滾動捲軸載入資料的下拉控制項
  • jquery動態載入select下拉框範例程式碼
  • JQuery非同步載入無限下拉框級聯功能實現樣本
  • jQuery+AJAX實現無重新整理下拉載入更多
  • jQuery類比原生態App上拉重新整理下拉載入更多頁面及原理
  • jQuery實現模仿微博下拉捲軸載入資料效果

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.