zoukankan      html  css  js  c++  java
  • mui前端框架下拉刷新分页加载数据

    前台

    mui.init();
                (function($) {
                    //阻尼系数
                    var deceleration = mui.os.ios?0.003:0.0009;
                    $('.mui-scroll-wrapper').scroll({
                        bounce: false,
                        indicators: true, //是否显示滚动条
                        deceleration:deceleration
                    });
                    $.ready(function() {
                        //循环初始化所有下拉刷新,上拉加载。
                        $.each(document.querySelectorAll('.mui-slider-group .mui-scroll'), function(index, pullRefreshEl) {
                            if(index==0){
                                // alert(index);
                                $(pullRefreshEl).pullToRefresh({
                                down: {
                                    callback:pulldownRefresh_zhengu 
                                },
                                up: {
                                    callback: pullupRefresh_zhengu
                                    
                                }
                            });
                            }else{
                                // alert(index);
                                $(pullRefreshEl).pullToRefresh({
                                container:"#item2mobile .mui-scroll",
                                down: {
                                    callback: pulldownRefresh_guandian
                                        
                                },
                                up: {
                                    callback: pullupRefresh_guandian
                                }
                            });
                            }
                            
                        });
                bbb(1);
                aaa(1);        
                var page = 1;
                var sum;
                var page1 = 1;
                var su;        
                /*诊股开始*/
                function pulldownRefresh_zhengu(){
                    var self = this;
                    page++;
                    setTimeout(function() {
                        bbb(page);
                        self.endPullDownToRefresh((sum <= page));
                    }, 1000);
                }
                function pullupRefresh_zhengu(){
                    var self = this;
                    page++;
                    setTimeout(function() {
                        bbb(page);
                        self.endPullUpToRefresh((sum <= page));
                    }, 1000);
                    }
                /*诊股结束*/
                /**观点开始**/
                function pulldownRefresh_guandian(){
                    var self = this;
                    page1++;
                        setTimeout(function() {
                            aaa(page1)
                            self.endPullDownToRefresh();
                        }, 1000);
                    }
                function pullupRefresh_guandian(){
                    var self = this;
                    page1++;
                    setTimeout(function() {
                        aaa(page1);
                        self.endPullUpToRefresh();
                    }, 1000);
                    }
                /**观点结束**/
                
                });
                    
            })(mui);

    然后写ajax请求,带入分页page。

    后台对传过来的page参数进行处理:

    $page = I('page');  //获取请求的页数 
    $pagenum = 15; //每页数量
    $start = ($page-1) * $pagenum;
    //查询数据
    limit($page,$pagenum)
  • 相关阅读:
    微信小程序 --- 获取当前坐标
    微信小程序 --- 缓存数据
    微信小程序 --- 音乐的播放和控制
    微信小程序 --- webSocket
    微信小程序 --- 文件的上传和下载
    微信小程序 --- 选择图片和拍照
    微信小程序 --- loading提示框
    微信小程序 --- toast消息提示框
    Atitit.attilax软件研发与项目管理之道
    Atitit.attilax软件研发与项目管理之道
  • 原文地址:https://www.cnblogs.com/guoyachao/p/7198847.html
Copyright © 2011-2022 走看看