jq监听滚动条滚动，上拉加载下一页内容

 

 

 具体代码：

 var loadMore = function () {
        let resList = [];
        for (let i = 0; i < item; i++) {
            resList.push(dataList[i]);
            if(item > data_length){
                $('.bottom_content').html("——沒有更多了——");
            } else{
                $('.bottom_content').html("——上拉加载更多——");
            }
        }
        $('.query_list').html(resList);
    }

$(document).ready(function() {
        $("#sectors").prepend("<option value='选择界别' selected='selected'>选择界别</option>");
        let data = {};
        loadMore();
        // 截取姓氏
        $('.book_item').each(function () {
            $(this).find('.surnames').text($(this).find('.book_name span').eq(0).text()[0])
        });
        let picker = document.getElementById('sectors');
        picker.onchange = function () {
            $('.picker').removeClass('active');
            $('.list_item').removeClass('mui-active');
            $('.list_item').text(picker.value);
            $('.select_id').text($("#sectors option:selected").attr("id"));
            console.log('id', $("#sectors option:selected").attr("id"));
            data.subsector_id = $('.select_id').text();
            $("#name_query").val('');
            getList();
        }
        var getList = function () {
            const url = '/home/index/book';
            $.ajax({
                url: url,
                type: "get",
                dataType: "text",
                data: data,
                async: false,
                success: function (re) {
                    console.log('查询结果',$(re).find("li").length);
                    $(window).scroll(function(){
                        //当时滚动条离底部60px时开始加载下一页的内容
                        if (($(window).height() + $(window).scrollTop()) >= $(document).height()) {
                            $('.bottom_content').html("——沒有更多了——");
                        }
                    })
                    $('.query_list').html($(re).find("ul").html());
                    $('.book_item').each(function () {
                        $(this).find('.surnames').text($(this).find('.book_name span').eq(0).text()[0])
                    });
                },
                error: function () {
                    console.log('请求失败')
                },
                beforeSend: function (request) {
                    // layer.msg('正在加载数据请稍后。。。');
                    request.setRequestHeader("X-Requested-With", "XMLHttpRequest");
                }
            });
        }
    });
    $(window).scroll(function(){
        //当时滚动条离底部60px时开始加载下一页的内容
        if (($(window).height() + $(window).scrollTop()) >= $(document).height()) {
            clearTimeout(timers);
            //这里还可以用 [ 延时执行 ] 来控制是否加载 （这样就解决了 当上页的条件满足时，一下子加载多次的问题啦）
            timers = setTimeout(function () {
                item += 10;
                if(! $('.select_id').text()){
                    loadMore(); //调用执行上面的加载方法
                }
            }, 300);
        }
    });