JS 上拉加载

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31

$(document).ready( function(){ $contentLoadTriggered = false; $("#mainDiv").scroll(function(){ if($("#mainDiv").scrollTop() >= ($("#wrapperDiv").height() -    $("#mainDiv").height()) &&   $contentLoadTriggered == false)    $contentLoadTriggered == false) { $contentLoadTriggered = true; $.ajax({ type: "POST", url: "LoadOnScroll.aspx/GetDataFromServer", data: "{}", contentType: "application/json; charset=utf-8", dataType: "json", async: true, cache: false, success: function (msg) { $("#wrapperDiv").append(msg.d); $contentLoadTriggered = false; }, error: function (x, e){ alert("The call to the server side failed. " + x.responseText); } } ); } } ); } );

　　

var range = 50;             //距下边界长度/单位px
    var totalheight = 0; 
    var num ={$data|count};
    var is_load =true;
    var main = $("#con");                     //主体元素
    $(window).scroll(function(){
        var srollPos = $(window).scrollTop();    //滚动条距顶部距离(页面超出窗口的高度)
        totalheight = parseFloat($(window).height()) + parseFloat(srollPos);
        if(($(document).height()-range) <= totalheight && is_load == true) {
            if(num < 5 ){
                return false;
            }       
            is_load = false;
            $("#loading").show();
            //alert("0000");
             $.ajax({
                 url : '{:u("Index/post_json")}',
                 type : 'post',
                 data : {"num":num,"sch_time":sch_time,"city_from":city_from,"city_dst":city_dst},
                 dataType : 'json',
                 success : function(msg) {
                     //alert(msg);
                     $("#loading").hide();
                     myobj=eval(msg); 
                     
                     if(num == myobj['nums']){
                         alert("已经没有新订单了");
                         is_load = false;    //停止加载
                         return false;
                     }else{
                         num=myobj['nums'];
                     }
                     myobjs=myobj['data'];
                     for(var i=0;i<myobjs.length;i++){
                         ht='<div class="trip_li">';
                         ht+='<img class="hot" src="__ROOT__/Public/images/icon_hot.png">';
                         if(myobjs[i]['fleet'].join_uf == 1){
                             ht+='<img class="uf" src="__ROOT__/Public/images/icon_uf.png">';
                         }
                         ht+='<button type="button" class="bespoke" onclick=javascript:window.location.href="'+"{:u('Index/order')}"+'/scid/'+myobjs[i].id+'">立即预约</button>';
                         ht+='<dl>';
                         ht+='<dt><font>'+myobjs[i].from_city+'</font>　<img  src="__ROOT__/Public/images/icon_go.png" />　<font>'+myobjs[i].dst_city+'</font></dt>';
                         ht+='<dd>发车时间：<i class="times">'+myobjs[i].sch_time+'</i></dd>';
                         ht+='<dd>车型：'+myobjs[i]['fleet'].best_car+'</dd>';
                         ht+='<dd><i class="red">￥'+myobjs[i].money+'</i>    <i class="red">空位数: '+myobjs[i].used+'/'+myobjs[i].seat+'</i> </dd>';
                         ht+='</dl>';
                         ht+='</div>';
                         //alert(ht);
                          main.append(ht);
                          
                     } 
                     is_load =true; //恢复加载功能
                     
                 }
             });
            
        }
    });