mui 监听scroll下拉刷新，避免多次刷新

mui自带了下拉刷新功能，但是这个在某些情况下不好用。比如，使用了offCanvasSide侧滑菜单，而且侧滑菜单和正文在一个webview中，如果加了mui自带的pullRefresh，主体内容（就是套在<div id="pullrefresh" class="mui-content mui-scroll-wrapper"><div class="mui-scroll">里面的内容）滚动不了了。具体原因不明，总之就没有细究了，干脆自己写了：

首先，在需要刷新的主体套上mui区域滚动：

<div class="mui-content mui-scroll-wrapper">
 <div class="mui-scroll"></div>
</div>

第二步，实例化区域滚动：

mui('.mui-scroll-wrapper').scroll({
 deceleration: 0.001 //flick 减速系数，系数越大，滚动速度越慢，滚动距离越小，默认值0.0006
});

第三步：

//下拉刷新
var refreshAble=1;
var scroll = mui('.mui-scroll-wrapper').scroll();
document.querySelector('.mui-scroll-wrapper').addEventListener('scroll', function (e){
 var scrollTop = scroll.y;
 if(scrollTop >30 && scrollTop<60){
 if(refreshAble){
 setTimeout(function(){
 pullrefresh(setRefreshAble);
 refreshAble=0;
 },500)
 }
 }
});

function setRefreshAble(){
 if(!refreshAble){
 refreshAble=1;
 }
}

这里解释下上面的代码:
1、当容器下拉的时候，判断滚动了多少，在一定区间去执行刷新事件pullrefresh，设置这个区间，是为了让刷新就在那个区间刷新，不能一直下拉，一直刷新。
2、在区间刷新还不行，会发现会刷新多次，于是设置了refreshAble，判断，当为1时，刷新，刷新完马上设置为0，这样就不会刷新了。那么什么时候再设置为1呢，pullrefresh(setRefreshAble)，这里的setRefreshAble是回调函数，当pullrefresh里面的刷新方法执行完，执行setRefreshAble，它的作用是将refreshAble再设置为1，以便下次下拉仍旧会执行刷新。
3、上面的都做了还是不行，每次下拉到30-60之间就立马刷新了，而且可能会导致卡顿，不好，所以设置了500毫秒的刷新延时，虽然并不能彻底解决刷新和下拉同时进行。
4、可能有朋友会说可以监听release释放下拉的时候执行刷新，这个我试了，不好用，还要解决很多问题。