jQuery實(shí)現(xiàn)下拉加載功能實(shí)例代碼
廢話不多說了,直接給大家貼代碼了,具體代碼如下所示:
<script> var str = ''; if(page=="") page=1; var stop=true;//觸發(fā)開關(guān),防止多次調(diào)用事件 $(window).scroll( function(event){ //當(dāng)內(nèi)容滾動(dòng)到底部時(shí)加載新的內(nèi)容 100當(dāng)距離最底部100個(gè)像素時(shí)開始加載. 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;//當(dāng)前要加載的頁碼 //加載提示信息 $("#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);//把新的內(nèi)容加載到內(nèi)容的后面 }); stop=true; },'JSON') } }); </script>
以上代碼是小編給大家分享的jQuery實(shí)現(xiàn)下拉加載功能實(shí)例代碼,希望對(duì)大家有所幫助!
相關(guān)文章
jquery實(shí)現(xiàn)點(diǎn)擊頁面回到頂部
本篇文章主要是對(duì)點(diǎn)擊回到頁面頂部或是首頁的功能進(jìn)行了介紹,這是頁面常用到的效果,需要的朋友可以過來參考下2016-11-11jQuery 驗(yàn)證插件 Web前端設(shè)計(jì)模式(asp.net)
asp.net下用戶注冊(cè)頁面的驗(yàn)證代碼,花了點(diǎn)時(shí)間將驗(yàn)證做成一個(gè)jQuery插件,希望對(duì)需要的朋友有所幫助。2010-10-10JQuery 兩種方法解決剛創(chuàng)建的元素遍歷不到的問題
本文主要介紹兩種方法,處理JQuery遍歷剛創(chuàng)建的元素問題,簡(jiǎn)單易用,希望能幫到大家。2016-04-04基于jQuery實(shí)現(xiàn)的無刷新表格分頁實(shí)例
這篇文章主要介紹了基于jQuery實(shí)現(xiàn)的無刷新表格分頁方法,結(jié)合完整實(shí)例形式較為詳細(xì)的分析了jQuery實(shí)現(xiàn)無刷新表格分頁的具體步驟與相關(guān)實(shí)現(xiàn)代碼,需要的朋友可以參考下2016-02-02使用jQuery動(dòng)態(tài)設(shè)置單選框的選中效果
這篇文章主要介紹了使用jQuery動(dòng)態(tài)設(shè)置單選框的選中效果,本文給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-12-12jquery中的查找parents與closest方法之間的區(qū)別
這篇文章主要是對(duì)jquery中的查找parents與closest方法之間的區(qū)別進(jìn)行了詳細(xì)的分析介紹,需要的朋友可以過來參考下,希望對(duì)大家有所幫助2013-12-12JQuery 浮動(dòng)導(dǎo)航欄實(shí)現(xiàn)代碼
JQuery 浮動(dòng)導(dǎo)航欄實(shí)現(xiàn)代碼,具體的可以根據(jù)需要自己修改。2009-08-08快速學(xué)習(xí)jQuery插件 jquery.validate.js表單驗(yàn)證插件使用方法
快速學(xué)習(xí)jQuery插件中的jquery.validate.js表單驗(yàn)證插件使用方法,Validation是歷史最悠久的jQuery插件之一,經(jīng)過了全球范圍內(nèi)不同項(xiàng)目的驗(yàn)證,并得到了許多Web開發(fā)者的好評(píng),感興趣的小伙伴們可以參考一下2015-12-12jQuery Ajax請(qǐng)求后臺(tái)數(shù)據(jù)并在前臺(tái)接收
這篇文章主要介紹了jQuery Ajax請(qǐng)求后臺(tái)數(shù)據(jù)并在前臺(tái)接收的相關(guān)資料,需要的朋友可以參考下2016-12-12基于jQuery實(shí)現(xiàn)的美觀星級(jí)評(píng)論打分組件代碼
這篇文章主要介紹了基于jQuery實(shí)現(xiàn)的美觀星級(jí)評(píng)論打分組件代碼,涉及jQuery回調(diào)函數(shù)及頁面元素屬性動(dòng)態(tài)操作的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-10-10