入门客AI创业平台(我带你入门,你带我飞行)
博文笔记

移动端下拉刷新

创建时间:2017-01-06 投稿人: 浏览次数:921

做了一个小的demo,移动端下拉刷新页面数据。没用插件。主要实现思路。大致说一下:
1.首先进入页面要进行ajax请求数据。
2.监视页面产生下拉动作,再次请求数据。
3.奏是这么简单粗暴。
4.上代码:

第一步:
$.ajax({
            url: basePath + "你自己的url", 
            type: "get",
            async: true,
            cache: false,
            dataType: "json",
            data:{curpage:curpage,rows:rows},
            success: function(jsondata) {
                if(jsondata.code==1){
                var investStatus="";
                totalCount= jsondata.obj.totalCount;
                var dataList=jsondata.obj.data;
                for(var i=0;i<dataList.length;i++){
                    if(dataList[i].status==2){
                        investStatus="立即投资";
                    }else{
                        investStatus="已抢光";

                    }
                    var html="<li data-id=""+dataList[i].id+"" data-status=""+dataList[i].status+""><span><input name=""+dataList[i].id+"" type="checkbox" data-status=""+dataList[i].status+""/></span><span>"+dataList[i].amount+"</span><span>"+isDayOrMonth(dataList[i].isDayLoan,dataList[i].periods)+"</span><span>"+dataList[i].process+"</span><span>"+investStatus+"</span></li>";
                    $("#mainList").append(html);

                }


              }
            }
        });
第二步:
//下拉刷新
    $(window).scroll(function(){
        console.log("下拉刷新");
        var scrollTop = $(this).scrollTop();   
        var scrollHeight = $(document).height();
        var windowHeight = $(this).height();
        if (scrollTop + windowHeight == scrollHeight) {
            if (curpage * rows < totalCount) {
                getData(++curpage);
            };
        }
    });

效果就是这样的
发现一个问题就是,我是整理近期问题才会来csdn更新博客,所以导致好多小伙伴私信我的问题,我都是过了好久才看到,
有不明白的地方,可以微博找我。
微博:璐飞童鞋。关注之后,私信即可。

声明:该文观点仅代表作者本人,入门客AI创业平台信息发布平台仅提供信息存储空间服务,如有疑问请联系rumenke@qq.com。
  • 上一篇:没有了
  • 下一篇:没有了
未上传头像