APP
APP
  • 发布:2014-10-12 17:43
  • 更新:2014-10-14 14:09
  • 阅读:4322

列表上拉刷新初始化

分类:HTML5+

使用js
mui.init({
swipeBack: false,
pullRefresh: {
container: '#mui-table-view-div-id',
up: {
contentdown: '上拉显示更多',
contentrefresh: '正在加载...',
callback: pullupRefresh
}
}
});

    /**  
         * 上拉加载具体业务实现  
         */  
        function pullupRefresh() {  
            var self = this;  
            setTimeout(function() {  
                loadData();//为ajax动态设置列表信息  
                self.endPullupToRefresh(false); //参数为true代表没有更多数据了。  
            }, 600);  
        }  

function loadData() {
url = server_url +"?ptype=3" + "&pageSize=" + page_size + "&currentPage=" + (currentPage++)
var xhr = new plus.net.XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState === 4) {
if (xhr.status == 200) {
console.log(xhr.responseText)
if (xhr.responseText != "") {
var data = JSON.parse( xhr.responseText ).C_ActList;
var table = document.body.querySelector('#mui-table-view-id');

                            if(currentPage == 1){  
                                table.innerHTML = "";  
                            }   

                            for (var i = 0; i < data.length; i++) {  
                                var li = document.createElement('li');  
                                li.className = 'mui-table-view-cell  hd-sty';  
                                var html = '<a href="#">';  
                                html += '<img class="mui-media-object mui-pull-left" src="' + (server_url + data[i].picurl) + '">';  
                                html += '<div class=" fz16 ">';  
                                html += '<div class="mui-media-body">' + data[i].title + '</div>';  
                                html += ' <p class="mui-ellipsis-2">' + data[i].actdescribe + '</p>';  

                                html += ' </div>';  
                                html += '</a>';  
                                li.innerHTML = html;  
                                table.appendChild(li);  
                            }  
                        }  
                    }  
                }  
            }  
            xhr.open("GET", url);  
            xhr.send();  
        }  

        mui.plusReady(function() {  
            loadData();  
        });  

这样页面在初始化的时候,执行ajax列表先一直显示 “上拉显示更多”,有没有什么办法可以在初始化 的时候显示loading或者不要显示上拉显示更多

2014-10-12 17:43 负责人:无 分享
已邀请:
DCloud_UNI_FXY

DCloud_UNI_FXY

下个版本开放pullupLoading接口。

到时候,页面初始化后,调用pullupLoading接口,会自动实现一次上拉加载的效果。
届时,不需要你自己手动调用loadData。只需要调用pullupLoading接口

  • APP (作者)

    下个版本什么时候发布啊。

    2014-10-15 13:00

  • 水逸

    加了后,滚动是可以了。但是滚动太快了。。怎么去除太快的滚动效果

    2014-10-17 16:06

该问题目前已经被锁定, 无法添加新回复