mui实现下拉加载更多

html代码

以下是js代码

        var pager = {}; //分页
    pager.page = 1;
    var totalPage; //总页码
        var total;//总条数
    pullRefresh(pager); //启用上拉下拉 
    console.log(pager.page)
    function pullRefresh() {
        mui("#refreshContainer").pullRefresh({
            up: {
                height: 50, //可选,默认50.触发下拉刷新拖动距离,
                auto: true, //可选,默认false.首次加载自动下拉刷新一次
                contentdown: "下拉可以加载更多", //可选，在下拉可刷新状态时，下拉刷新控件上显示的标题内容
                contentover: "释放立即加载", //可选，在释放可刷新状态时，下拉刷新控件上显示的标题内容
                contentrefresh: "正在加载...", //可选，正在加载状态时，上拉加载控件上显示的标题内容
                contentnomore: '没 有 更 多 数 据 了', //可选，请求完毕若没有更多数据时显示的提醒内容；
                callback: function() { //必选，刷新函数，根据具体业务来编写，比如通过ajax从服务器获取新数据；
                    window.setTimeout(function() {
                        pager['size'] = 10; //条数
                        console.log(pager.page)
                        getData(pager);
                    }, 500);
                }
            },

        })
    }

    function getData(params) {
        var start = params.page;
        var end = params.size;
        console.log(start)
        console.log(end)
        mui.ajax("/receiver_message", {
            data: {
                start: start,
                end: end
            },
            dataType: 'json', //服务器返回json格式数据
            type: 'post', //HTTP请求类型
            timeout: 10000, //超时时间设置为10秒；
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            },
            success: function(data) {
                mui('#refreshContainer').pullRefresh().endPullupToRefresh(true);
                console.log(data.result)
                if(data.result == '0000') {
                    //下面这坨都是在拼dom 你可以用jquery 或者是你所熟悉的angular,vue双向绑定
                    var data = data.messages;
                    var message_id = document.getElementById('message');
                    for(i = 0; i < data.length; i++) {
                        var readsign = "readsign" + data[i].id;
                        //console.log(readsign)
                        var sign;
                        if(data[i].read == true) {
                            sign = '已读';
                        } else if(data[i].read == false) {
                            sign = '未读';
                        }
                        localStorage.setItem('"' + readsign + '"', sign);
                        var readsign_storage = localStorage.getItem('"' + readsign + '"');
                        //console.log(readsign_storage)
                        var html1 = '
' + data[i].title

                        var html11 = ''
                        var read_type

                        //console.log(readsign)
                        var readsign_storage = localStorage.getItem('"' + readsign + '"');
                        //console.log(readsign_storage)
                        if(readsign_storage == "已读") {
                            read_type = '已读';
                            var html12 = ''
                        } else if(readsign_storage == "未读") {
                            read_type = '未读';

                            var html12 = ''
                        }
                        //console.log(read_type)
                        var html2 = '
发送人：' + data[i].username + '
状态：' + read_type + '
时间：' + data[i].create_time + '
消息内容
标题:
' + data[i].title + '
内容:
' + data[i].message + '
发送人:
' + data[i].username + '
发送时间:
' + data[i].create_time + '
';
                        var html21
                        if(data[i].showbutton == undefined) {
                            html21 = '
查看故障信息  
';
                        } else if(data[i].showbutton == true) {
                            html21 = '
查看故障信息  
';
                        } else {
                            html21 = '';
                        }

                        var html22 = '
';
                        if(data[i].star == true && data[i].read == false) {
                            var html3 = html1 + html11 + html12 + html2 + html21 + html22
                        } else if(data[i].read == true || data[i].star == false) {
                            var html3 = html1 + html11 + html12 + html2 + html21 + html22
                        } else {
                            var html3 = html1 + html11 + html12 + html2 + html21 + html22
                        }

                        message_id.innerHTML += html3;
                    }

                    //这里很重要，这里获取页码 公式：总条数/每页显示条数
                    totalPage = total % pager.size != 0 ?parseInt(total / pager.size) + 1 :total / pager.size;
                    
                
                    if(totalPage == pager.page) { //总页码等于当前页码，停止上拉下拉                mui('#refreshContainer').pullRefresh().endPullupToRefresh(true);
                    } else {
                        pager.page = pager.page+1;
                        console.log('pager.page' + pager.page)
                        mui('#refreshContainer').pullRefresh().refresh(true);
                    }

                } else if(data.result == '0001') {

                }

            },
            error: function(xhr, type, errorThrown) {
                //异常处理；
                console.log(type);
            }
        })
    }