swiper上拉刷新要引入哪些js

发布网友发布时间：2022-04-22 09:28

共1个回答

热心网友时间：2022-04-24 00:01

首先你的搭建你的HTML结构：如以下代码，运动的对象就是你ID为wrapper下的第一个子元素,没法谁叫你用的框架呢。当然同学们也可以自行扩展..引完js，搭建好结构以后然后再贴入如下脚本functionloaded(){pullDownEl=document.getElementById('pullDown');pullDownOffset=pullDownEl.offsetHeight;pullUpEl=document.getElementById('pullUp');pullUpOffset=pullUpEl.offsetHeight;myScroll=newiScroll('wrapper',{useTransition:true,topOffset:pullDownOffset,onRefresh:function(){if(pullDownEl.className.match('loading')){pullDownEl.className='';pullDownEl.querySelector('.pullDownLabel').innerHTML='下拉刷新';}elseif(pullUpEl.className.match('loading')){pullUpEl.className='';pullUpEl.querySelector('.pullUpLabel').innerHTML='上拉加载';}},onScrollMove:function(){if(this.y>5&&!pullDownEl.className.match('flip')){pullDownEl.className='flip';pullDownEl.querySelector('.pullDownLabel').innerHTML='松开刷新';this.minScrollY=0;}elseif(this.y(this.maxScrollY+10)&&pullUpEl.className.match('flip')){pullUpEl.className='';pullUpEl.querySelector('.pullUpLabel').innerHTML='上拉加载';this.maxScrollY=pullUpOffset;}},onScrollEnd:function(){if(pullDownEl.className.match('flip')){pullDownEl.className='loading';pullDownEl.querySelector('.pullDownLabel').innerHTML='加载中';pullDownAction();//Executecustomfunction(ajaxcall?)}elseif(pullUpEl.className.match('flip')){pullUpEl.className='loading';pullUpEl.querySelector('.pullUpLabel').innerHTML='加载中';pullUpAction();//Executecustomfunction(ajaxcall?)}}});setTimeout(function(){document.getElementById('wrapper').style.left='0';},800);}document.addEventListener('touchmove',function(e){e.preventDefault();},false);document.addEventListener('DOMContentLoaded',function(){setTimeout(loaded,200);},false);准备就绪后就应该执行了functionpullDownAction(){//下拉刷新window.location.reload();}vari=2;//初始化页码为2functionpullUpAction(){上拉加载varpage=i++;//每上拉一次页码加一次（就比如下一页下一页）Ajax(page);//运行ajax把2传过去告诉后台我上拉一次后台要加一页数据（当然这个具体传什么还得跟后台配合）myScroll.refresh();//<--Simulatenetworkcongestion,removesetTimeoutfromproction!}functionAjax(page){//ajax后台交互$.ajax({type:"post",dataType:"JSON",url:"/installerAjax",//你请求的地址data:{'page':page//传过去的页码},success:function(data){data=eval(data.clientList);if(data.length){//如果后台传过来有数据执行如下操作，没有就执行else告诉用户没有内容呢加载数据。。。}}else{$('.pullUpLabel').html('亲，没有内容了！');}},error:function(){}});}