手机版下拉AJAX异步获取分页数据

使用AJAX异步获取分页数据

1、HTML代码 程序获取的数据库数据循环遍历                 

    
        

            {$vo}
        
    

下拉加载更多

2、JS代码

$(function () {
        // 翻页
        var page = 1; // 初始页码
        $(window).scroll(function(){
            if($('#PageMore').html() == '下拉加载更多'){
                var wHeight = $(document).height() - $(window).height();
                if($(document).scrollTop() >= wHeight - 100){
                    $('#PageMore').html('加载中...');
                    $('#PageMore').show();
                    page++;
                    listAjax();
                }
            }
        });

        function listAjax(){
            $.ajax({
                type: "post",
                url: "url",
                data: {
                    'page': page
                },
                dataType: "html",
                success: function(html){
                    if(html == 'end'){
                        $('#PageMore').html('亲，没有更多内容了！');
                        $('#PageMore').delay(3000).fadeOut("fast"); // 三秒后渐隐
                    }else{
                        $('#PageMore').html('下拉加载更多');
                        $(".append").append(html);
                    }
                }
            });
        }
    })

3、查询程序获取的数据库数据循环遍历拼接好html返回即可