手機網站下拉加載數據js(簡單版)

加載內容的地方html

 <div class="bgcolor_f0 clearfix">
        <div class="recharge">
            <ul class="recharge-list">
                內容的地方,第一加載輸入
                 {loop $orderlist $order}
                <li class="recharge-list-view">
                    {$order['date']}——站內充值
                    <span>{$order['money']}</span>
                </li>
                {/loop}
            </ul>
        </div>
    </div>
 <input type="hidden" id="page" value="1"/>//

下拉加載內容的js

    $(function(){
        $(window).scroll(function(){
            var scrollTop = $(this).scrollTop();               //滾動條距離頂部的高度
            var scrollHeight = $(document).height();           //當前頁面的總高度
            var windowHeight = $(this).height();               //當前可視的頁面高度
            if(scrollTop + windowHeight >= scrollHeight)  { //距離頂部+當前高度 >=文檔總高度 即代表滑動到底部
                var page = parseInt($("#page").val())+1;
                $.ajax({
                    type:'POST',
                    data:"page="+page,
                    url:SITEURL+'user/ajax_record_more',
                    dataType:'json',
                    success:function(data){
                        console.log(data.status);
                        console.log(data.orderlist);
                        if(data.status=='success'){
                            var html = '';
                            $.each(data.orderlist,function(i,row){
                                html+='<li class="recharge-list-view">'+row['date']+'——站內充值 <span>'+row['money']+'</span></li>';
                            })
                            $("#page").val(page);
                            $(".recharge-list").append(html);
                        }

                    }
                })

            }

        })

    })