iscroll 4 上拉加载下拉刷新

  //重置iscroll
            function Refresh() {
                  setTimeout(function () {
                  myScroll.refresh();
                  }, 500);
            }
        //页面滑动
        var myScroll=new iScroll("com_section",{//容器id名直接放这
            hScrollbar:false,
            vScrollbar:false,
            onScrollMove: function () { 
                if(this.y>0){
                    if(this.y>40){
                    $('#lotop').show()//刷新图片的显示
                    $('#lotop').addClass('flip')
                    return;
                }
                }else{
                  if(this.y+50 < (this.maxScrollY)){//释放加载
                       $('#loda').show()//加载图片的显示
                      $('#loda').addClass('flip')
                    return;
                   } else {
                    // $('#loda').text('上拉加载')//上拉加载更多...
                    return;
                   }
                }
                }, onScrollEnd:function(){//松开屏幕时
                      if($('#lotop').hasClass('flip')){//下拉刷新
                      $('#lotop').removeClass('flip')
                       setTimeout(function () {
                         $('#lotop').hide()
                      }, 400);
                    
                    Ajax(Data)//重新请求数据
                }
                if($('#loda').hasClass('flip')){//上拉加载
                    $('#loda').removeClass('flip')
                    $('#loda').hide()
                    Data.iDisplayLength+=10;//数据长度加10
                    Ajax(Data)//重新请求数据
                }
            }
        });  
 //新数据渲染成功后执行 Refresh() 重置iscroll

猜你喜欢

转载自blog.csdn.net/weixin_34364135/article/details/90849168