jQuery 下拉加载

    $("#box").scroll(function (event) {  // box  是你要下拉的区域id ,  也可以直接使用$(window).scroll


        var h = $(this).height(); //div可视区域的高度
        var sh = $(this)[0].scrollHeight; //滚动的高度,$(this)指代jQuery对象,而$(this)[0]指代的是dom节点
        var st = $(this)[0].scrollTop; //滚动条的高度,即滚动条的当前位置到div顶部的距离
        if (h + st >= sh - 3) {
            page++    // 事件请求page 
            getMore(page)   // 请求事件
        }  
    });



    var listArr = []

    function getMore(page, ) { //请求事件
        $.ajax({
            url: "{php echo mobileUrl('groups')}" + "&page=" + page,
            data: {
                page: page
            },
            type: 'post',
            cache: false,
            dataType: 'json',
            success: function (data) {
                if (data.status == 1) {
                    listArr = listArr.concat(data.result.list)
                    console.log("listarr", listArr)
                    var str = '';
                    for (var i = 0; i < listArr.length; i++) {
                        // 渲染内容
                    }
                    $("#content").append();
                }
            },
            error: function () {
                alert("异常!");
            }
        });
    }

你可能感兴趣的:(jQuery 下拉加载)