注册 登录
l***@qq.com
l***@qq.com
  • 发布：2017-01-13 17:13
  • 更新：2018-09-19 13:52
  • 阅读：7112

MUI添加上拉加载下拉刷新后，iOS和WEB能用，安卓不能正常滑动！

分类：MUI

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>OA</title>
<script src="js/mui.min.js"></script>
<script src="js/jquery-2.1.1.min.js"></script>
<link href="css/mui.min.css" rel="stylesheet" />
<link href="css/style.css" rel="stylesheet" />
<script type="text/javascript" charset="utf-8"> 

  var ua = navigator.userAgent.toLowerCase();  
  var sys = ua.match(/html5plus/);  
  if (sys != 'html5plus') {  
    mui.openWindow = function openWindow(param, target, options) {  
      if (param.target == '_blank') {  
        window.open(param.url);  
      } else {  
        window.location.href = param.url;  
      }  
    }  
  }  

  //        function menuClick(){  
  //            console.log('123');  
  //            mui('.mui-off-canvas-wrap').offCanvas('show');  
  //  
  //        }  
  </script>  
<style type="text/css">  
.header{ position: fixed; width: 100%; background-color: #177df9; height:64px; float:left; text-align: center; z-index: 10; }  
.titleLab{ float:left; margin-top:29px; width:100%; text-align:center; font-size:18px; color:#fff; }  
.indexOfficeLi{ float:left; position: relative; width:100%; height:57px; cursor: pointer; list-style-type:none; }  
.bgImg{ float:left; width:4px; height:53px; margin-top:2px; }  
    .lab{ float:left; margin:9px 0 0 32px; font-size:13px; width: 80%; color:#333; }  
     .typeLab{ float:left; margin:1px 0 0 32px; font-size:11px; line-height: 13px; text-align: center; width: 35px; height: 13px; color:#fff; background: url(image/job/typebj.png) no-repeat; }  
      .bottomUl{ float: left; width: 100%; height: 100%; } .bottomUl li{ float:left; width: 25%; height: 100%; text-align: center; }  
       .ceUl{ float: left; width: 100%; height: 100%; }  
        .ceLiImg{ float:left; margin:6px 0 0 43px; width:22px; }  
         .ceLiLab{ float: left; height: 100%; line-height: 33px; font-size: 15px; color: #18bfff; margin:0 0 0 16px; }  
        .ceLiNumber{ float: right; width: 34px; height: 15px; background: url(image/linumber.png); margin:10px 30px 0 0; font-size: 11px; color: #fff; line-height: 15px; text-align: center; }  
         .mui-table-view{ text-align: left; background: none !important; } .mui-table-view:after{ height:0; } .mui-table-view-cell:after{ height:0; } .mui-table-view:after{ height:0; } .mui-table-view:before{ height:0; } .mui-table-view-cell:before{ height:0; }  
          .mui-table-view-cell.mui-active{ margin-top: 0px !important; background-color: #363944; }  
          .mui-bar-nav~.mui-content .mui-pull-top-pocket{top:0px !important;}  
</style>

</head>

<body style="background: #fff;">
<!-- 侧滑导航根容器 -->
<div class="mui-off-canvas-wrap mui-draggable mui-scalable">
<!-- 菜单容器 -->
<aside class="mui-off-canvas-left">
<div class="mui-scroll-wrapper">
<div class="mui-scroll" id="scroll123" style="height:80%;margin-top:22%;overflow: auto;">
<ul class="mui-table-view">
<li class="mui-table-view-cell mui-collapse" style="margin-bottom:28px;padding: 0;" id="dbsyLi">
<div style="float:left;width:100%;height:33px;">
<img src="image/dbsy.png" class="ceLiImg" />
<label class="ceLiLab">待办事宜</label></div>
</li>
<li class="mui-table-view-cell mui-collapse" style="margin-bottom:28px;padding: 0;" id="ybsyLi">
<div style="float:left;width:100%;height:33px;">
<img src="image/ybsy.png" class="ceLiImg" />
<label class="ceLiLab">已办事宜</label></div>
</li>
<li class="mui-table-view-cell mui-collapse" style="margin-bottom:28px;padding: 0;" id="wdqqLi">
<div style="float:left;width:100%;height:33px;">
<img src="image/wdqq.png" class="ceLiImg" />
<label class="ceLiLab">我的请求</label></div>
</li>
<li class="mui-table-view-cell mui-collapse" style="margin-bottom:28px;padding: 0;" id="cssyLi">
<div style="float:left;width:100%;height:33px;">
<img src="image/cssy.png" class="ceLiImg" />
<label class="ceLiLab">抄送事宜</label></div>
</li>
<li class="mui-table-view-cell mui-collapse" style="margin-bottom:28px;padding: 0;" id="bjsyLi">
<div style="float:left;width:100%;height:33px;">
<img src="image/bjsy.png" class="ceLiImg" />
<label class="ceLiLab">办结事宜</label></div>
</li>
<li class="mui-table-view-cell mui-collapse" style="margin-bottom:28px;padding: 0;" id="xwLi">
<div style="float:left;width:100%;height:33px;">
<img src="image/xw.png" class="ceLiImg" />
<label class="ceLiLab">新闻</label></div>
</li>
<li class="mui-table-view-cell mui-collapse" style="margin-bottom:28px;padding: 0;" id="rcLi">
<div style="float:left;width:100%;height:33px;">
<img src="image/rc.png" class="ceLiImg" />
<label class="ceLiLab">日程</label></div>
</li>
<li class="mui-table-view-cell mui-collapse" style="margin-bottom:28px;padding: 0;" id="hyLi">
<div style="float:left;width:100%;height:33px;">
<img src="image/hy.png" class="ceLiImg" />
<label class="ceLiLab">会议</label></div>
</li>
<li class="mui-table-view-cell mui-collapse" style="margin-bottom:28px;padding: 0;" id="wdzxLi">
<div style="float:left;width:100%;height:33px;">
<img src="image/wdzx.png" class="ceLiImg" />
<label class="ceLiLab">文档中心</label></div>
</li>
</ul>
</div>
</div>
</aside>
<!-- 主页面容器 -->
<div class="mui-inner-wrap">
<!-- 主页面标题 -->
<header class="mui-bar mui-bar-nav" style="background: #177df9;">
<img src="image/job/menu.png" class="mui-icon mui-action-menu mui-icon-bars mui-pull-left" id="menuBtn"/>
<h1 class="mui-title" style="color: #fff;">我的工作</h1>
</header>
<nav class="mui-bar mui-bar-tab" style="background: #fff;border: 1px solid #eaeaea;">
<a id="defaultTab" class="mui-tab-item mui-active" href="index.html">
<img src="image/job/job-hover.png" style="margin-top:6px;" />
<label style="float:left;width:100%;font-size: 11px;color: #0379fd;line-height:13px;">工作</label>
</a>
<a class="mui-tab-item" href="communication.html">
<img src="image/job/txl.png" style="margin-top:4px;" />
<label style="float:left;width:100%;font-size: 11px;color: #acacac;line-height:13px;">通讯录</label>
</a>
<a class="mui-tab-item" href="attendance.html">
<img src="image/job/kq.png" style="margin-top:7px;" />
<label style="float:left;width:100%;font-size: 11px;color: #acacac;line-height:13px;">考勤</label>
</a>
<a class="mui-tab-item" href="user.html">
<img src="image/job/my.png" style="margin-top:5px;" />
<label style="float:left;width:100%;font-size: 11px;color: #acacac;line-height:13px;">我的</label>
</a> 

</nav>  
 <div style="float:left;width:100%;height:44px;background:#f8f8f8;margin-top:44px;">  
     <div style="float:left;margin:8px 2%;background:#fff;height:28px;width:96%;border-radius: 5px;">  
       <div style="float:left;width:28px;height:28px;cursor:pointer;">  
         <img src="image/job/search.png" style="float:left;margin:8px 0 0 7px;width: 12px;" onclick="menuClick()" /></div>  
       <input type="text" style="float:left;margin:0 0 0 0;height:100%;width:85%;line-height:100%;font-size:12px;color:#999999;border:none;outline:none;padding: 0;" placeholder="输入文档标题" /></div>  
 </div>  
<div class="mui-content mui-scroll-wrapper" style="background: #fff;float:left;position: relative;height:80%;padding:0;width:100%;" id="pullrefresh">  

  <div class="mui-scroll">  
    <ul class="mui-table-view" style="float:left;background: #fff;width:100%;">  
          <li class="mui-table-view-cell mui-collapse" id="list1" style="padding: 0;">  
            <div style="float:left;position: relative;width:100%;height:57px;">  
              <div class='bgImg' style="background:#6c7fbc;"></div>  
              <label class='lab' style="cursor:pointer">出差青岛</label>  
              <label class='typeLab' style="cursor:pointer">日程</label>  
              <label style="float:left;margin:1px 0 0 15px;font-size:11px;line-height:13px;color:#333;cursor:pointer">果汁儿</label>  
              <label style="float:right;margin:1px 14px 0 0px;font-size:11px;line-height:13px;color:#999;cursor:pointer">今天 15:17</label>  
              <div style="position: absolute;bottom:1px;left:28px;width:50%;height:1px;background:#eaeaea;"></div>  
              <div style="position: absolute;bottom:1px;right:28px;width:50%;height:1px;background:#eaeaea;"></div>  
            </div>  
          </li>  
          <li class="mui-table-view-cell mui-collapse" style="padding: 0;">  
            <div style="float:left;position: relative;width:100%;height:57px;">  
              <div class='bgImg' style="background:#34a6d8;"></div>  
              <label class='lab' style="cursor:pointer">出差青岛</label>  
              <label class='typeLab' style="cursor:pointer">会议</label>  
              <label style="float:left;margin:1px 0 0 15px;font-size:11px;line-height:13px;color:#333;cursor:pointer">果汁儿</label>  
              <label style="float:right;margin:1px 14px 0 0px;font-size:11px;line-height:13px;color:#999;cursor:pointer">今天 15:17</label>  
              <div style="position: absolute;bottom:1px;left:28px;width:50%;height:1px;background:#eaeaea;"></div>  
              <div style="position: absolute;bottom:1px;right:28px;width:50%;height:1px;background:#eaeaea;"></div>  
            </div>  
          </li>  
          <li class="mui-table-view-cell mui-collapse" style="padding: 0;">  
            <div style="float:left;position: relative;width:100%;height:57px;">  
              <div class='bgImg' style="background:#de5c6f;"></div>  
              <label class='lab' style="cursor:pointer">出差青岛</label>  
              <label class='typeLab' style="cursor:pointer">流程</label>  
              <label style="float:left;margin:1px 0 0 15px;font-size:11px;line-height:13px;color:#333;cursor:pointer">果汁儿</label>  
              <label style="float:right;margin:1px 14px 0 0px;font-size:11px;line-height:13px;color:#999;cursor:pointer">今天 15:17</label>  
              <div style="position: absolute;bottom:1px;left:28px;width:50%;height:1px;background:#eaeaea;"></div>  
              <div style="position: absolute;bottom:1px;right:28px;width:50%;height:1px;background:#eaeaea;"></div>  
            </div>  
          </li>  
          <li class="mui-table-view-cell mui-collapse" style="padding: 0;">  
            <div style="float:left;position: relative;width:100%;height:57px;">  
              <div class='bgImg' style="background:#6c7fbc;"></div>  
              <label class='lab' style="cursor:pointer">出差青岛</label>  
              <label class='typeLab' style="cursor:pointer">日程</label>  
              <label style="float:left;margin:1px 0 0 15px;font-size:11px;line-height:13px;color:#333;cursor:pointer">果汁儿</label>  
              <label style="float:right;margin:1px 14px 0 0px;font-size:11px;line-height:13px;color:#999;cursor:pointer">今天 15:17</label>  
              <div style="position: absolute;bottom:1px;left:28px;width:50%;height:1px;background:#eaeaea;"></div>  
              <div style="position: absolute;bottom:1px;right:28px;width:50%;height:1px;background:#eaeaea;"></div>  
            </div>  
          </li>  
          <li class="mui-table-view-cell mui-collapse" style="padding: 0;">  
            <div style="float:left;position: relative;width:100%;height:57px;">  
              <div class='bgImg' style="background:#6c7fbc;"></div>  
              <label class='lab' style="cursor:pointer">出差青岛</label>  
              <label class='typeLab' style="cursor:pointer">日程</label>  
              <label style="float:left;margin:1px 0 0 15px;font-size:11px;line-height:13px;color:#333;cursor:pointer">果汁儿</label>  
              <label style="float:right;margin:1px 14px 0 0px;font-size:11px;line-height:13px;color:#999;cursor:pointer">今天 15:17</label>  
              <div style="position: absolute;bottom:1px;left:28px;width:50%;height:1px;background:#eaeaea;"></div>  
              <div style="position: absolute;bottom:1px;right:28px;width:50%;height:1px;background:#eaeaea;"></div>  
            </div>  
          </li>  
          <li class="mui-table-view-cell mui-collapse" style="padding: 0;">  
            <div style="float:left;position: relative;width:100%;height:57px;">  
              <div class='bgImg' style="background:#6c7fbc;"></div>  
              <label class='lab' style="cursor:pointer">出差青岛</label>  
              <label class='typeLab' style="cursor:pointer">日程</label>  
              <label style="float:left;margin:1px 0 0 15px;font-size:11px;line-height:13px;color:#333;cursor:pointer">果汁儿</label>  
              <label style="float:right;margin:1px 14px 0 0px;font-size:11px;line-height:13px;color:#999;cursor:pointer">今天 15:17</label>  
              <div style="position: absolute;bottom:1px;left:28px;width:50%;height:1px;background:#eaeaea;"></div>  
              <div style="position: absolute;bottom:1px;right:28px;width:50%;height:1px;background:#eaeaea;"></div>  
            </div>  
          </li>  
          <li class="mui-table-view-cell mui-collapse" style="padding: 0;">  
            <div style="float:left;position: relative;width:100%;height:57px;">  
              <div class='bgImg' style="background:#6c7fbc;"></div>  
              <label class='lab' style="cursor:pointer">出差青岛</label>  
              <label class='typeLab' style="cursor:pointer">日程</label>  
              <label style="float:left;margin:1px 0 0 15px;font-size:11px;line-height:13px;color:#333;cursor:pointer">果汁儿</label>  
              <label style="float:right;margin:1px 14px 0 0px;font-size:11px;line-height:13px;color:#999;cursor:pointer">今天 15:17</label>  
              <div style="position: absolute;bottom:1px;left:28px;width:50%;height:1px;background:#eaeaea;"></div>  
              <div style="position: absolute;bottom:1px;right:28px;width:50%;height:1px;background:#eaeaea;"></div>  
            </div>  
          </li>  
          <li class="mui-table-view-cell mui-collapse" style="padding: 0;">  
            <div style="float:left;position: relative;width:100%;height:57px;">  
              <div class='bgImg' style="background:#6c7fbc;"></div>  
              <label class='lab' style="cursor:pointer">出差青岛</label>  
              <label class='typeLab' style="cursor:pointer">日程</label>  
              <label style="float:left;margin:1px 0 0 15px;font-size:11px;line-height:13px;color:#333;cursor:pointer">果汁儿</label>  
              <label style="float:right;margin:1px 14px 0 0px;font-size:11px;line-height:13px;color:#999;cursor:pointer">今天 15:17</label>  
              <div style="position: absolute;bottom:1px;left:28px;width:50%;height:1px;background:#eaeaea;"></div>  
              <div style="position: absolute;bottom:1px;right:28px;width:50%;height:1px;background:#eaeaea;"></div>  
            </div>  
          </li>  
          <li class="mui-table-view-cell mui-collapse" style="padding: 0;">  
            <div style="float:left;position: relative;width:100%;height:57px;">  
              <div class='bgImg' style="background:#6c7fbc;"></div>  
              <label class='lab' style="cursor:pointer">出差青岛</label>  
              <label class='typeLab' style="cursor:pointer">日程</label>  
              <label style="float:left;margin:1px 0 0 15px;font-size:11px;line-height:13px;color:#333;cursor:pointer">果汁儿</label>  
              <label style="float:right;margin:1px 14px 0 0px;font-size:11px;line-height:13px;color:#999;cursor:pointer">今天 15:17</label>  
              <div style="position: absolute;bottom:1px;left:28px;width:50%;height:1px;background:#eaeaea;"></div>  
              <div style="position: absolute;bottom:1px;right:28px;width:50%;height:1px;background:#eaeaea;"></div>  
            </div>  
          </li>  
          <li class="mui-table-view-cell mui-collapse" style="padding: 0;">  
            <div style="float:left;position: relative;width:100%;height:57px;">  
              <div class='bgImg' style="background:#6c7fbc;"></div>  
              <label class='lab' style="cursor:pointer">出差青岛</label>  
              <label class='typeLab' style="cursor:pointer">日程</label>  
              <label style="float:left;margin:1px 0 0 15px;font-size:11px;line-height:13px;color:#333;cursor:pointer">果汁儿</label>  
              <label style="float:right;margin:1px 14px 0 0px;font-size:11px;line-height:13px;color:#999;cursor:pointer">今天 15:17</label>  
              <div style="position: absolute;bottom:1px;left:28px;width:50%;height:1px;background:#eaeaea;"></div>  
              <div style="position: absolute;bottom:1px;right:28px;width:50%;height:1px;background:#eaeaea;"></div>  
            </div>  
          </li>  
          <li class="mui-table-view-cell mui-collapse" style="padding: 0;">  
            <div style="float:left;position: relative;width:100%;height:57px;">  
              <div class='bgImg' style="background:#6c7fbc;"></div>  
              <label class='lab' style="cursor:pointer">出差青岛</label>  
              <label class='typeLab' style="cursor:pointer">日程</label>  
              <label style="float:left;margin:1px 0 0 15px;font-size:11px;line-height:13px;color:#333;cursor:pointer">果汁儿</label>  
              <label style="float:right;margin:1px 14px 0 0px;font-size:11px;line-height:13px;color:#999;cursor:pointer">今天 15:17</label>  
              <div style="position: absolute;bottom:1px;left:28px;width:50%;height:1px;background:#eaeaea;"></div>  
              <div style="position: absolute;bottom:1px;right:28px;width:50%;height:1px;background:#eaeaea;"></div>  
            </div>  
          </li>  
          <li class="mui-table-view-cell mui-collapse" style="padding: 0;">  
            <div style="float:left;position: relative;width:100%;height:57px;">  
              <div class='bgImg' style="background:#6c7fbc;"></div>  
              <label class='lab' style="cursor:pointer">出差青岛</label>  
              <label class='typeLab' style="cursor:pointer">日程</label>  
              <label style="float:left;margin:1px 0 0 15px;font-size:11px;line-height:13px;color:#333;cursor:pointer">果汁儿</label>  
              <label style="float:right;margin:1px 14px 0 0px;font-size:11px;line-height:13px;color:#999;cursor:pointer">今天 15:17</label>  
              <div style="position: absolute;bottom:1px;left:28px;width:50%;height:1px;background:#eaeaea;"></div>  
              <div style="position: absolute;bottom:1px;right:28px;width:50%;height:1px;background:#eaeaea;"></div>  
            </div>  
          </li>  
          <li class="mui-table-view-cell mui-collapse" style="padding: 0;">  
            <div style="float:left;position: relative;width:100%;height:57px;">  
              <div class='bgImg' style="background:#6c7fbc;"></div>  
              <label class='lab' style="cursor:pointer">出差青岛</label>  
              <label class='typeLab' style="cursor:pointer">日程</label>  
              <label style="float:left;margin:1px 0 0 15px;font-size:11px;line-height:13px;color:#333;cursor:pointer">果汁儿</label>  
              <label style="float:right;margin:1px 14px 0 0px;font-size:11px;line-height:13px;color:#999;cursor:pointer">今天 15:17</label>  
              <div style="position: absolute;bottom:1px;left:28px;width:50%;height:1px;background:#eaeaea;"></div>  
              <div style="position: absolute;bottom:1px;right:28px;width:50%;height:1px;background:#eaeaea;"></div>  
            </div>  
          </li>  
        </ul>  
  </div>  
</div>

</div>
</div> 

<script type="text/javascript" charset="utf-8">  
      mui('#scroll123').scroll();  
  mui('#pullrefresh').scroll();

//// mui('.mui-scroll-wrapper').scroll({deceleration: 0.0005});
mui.init({
gestureConfig:{
tap: true, //默认为true
doubletap: true, //默认为false
longtap: true, //默认为false
swipe: true, //默认为true
drag: true, //默认为true
hold:true,//默认为false，不监听
release:true//默认为false，不监听
},
pullRefresh: {
container: '#pullrefresh',
down: {//下拉刷新
auto:true,//可选,默认false.自动下拉刷新一次
contentdown : "下拉可以刷新",//可选，在下拉可刷新状态时，下拉刷新控件上显示的标题内容
contentover : "释放立即刷新",//可选，在释放可刷新状态时，下拉刷新控件上显示的标题内容
contentrefresh : "正在刷新...",//可选，正在刷新状态时，下拉刷新控件上显示的标题内容
callback: pulldownRefresh
},
up: {//上拉加载
//auto:true,//可选,默认false.自动上拉加载一次
contentrefresh: '正在加载...',
contentnomore:'没有更多数据了',//可选，请求完毕若没有更多数据时显示的提醒内容；
callback: pullupRefresh
}
}
});

function pulldownRefresh() {
// setTimeout(function() {
// count = 1;//刷新并显示第一页
// data={
// //...,
// page:count
// };
// type=1;//代表下拉刷新
// toList(data,type);//具体取数据的方法
// }, 100);
mui('#pullrefresh').pullRefresh().endPulldownToRefresh();
}

function pullupRefresh() {
// setTimeout(function() {
// count++;//翻下一页
// data={
// //...,
// page:count
// };
// type=2;//代表上拉加载
// toList(data,type);//具体取数据的方法
// }, 100);
mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
}
mui.plusReady(function() {
var temp = plus.display.resolutionHeight;
temp = temp - 44 - 49 - 50;
$('#pullrefresh').css('height',temp + 'px');
}); 

  mui('.mui-bar-tab').on('tap','a',function(){document.location.href=this.href;});  
  //侧边栏  
   var menuBtn = document.getElementById("menuBtn");  
  //监听点击事件  
   menuBtn.addEventListener("tap",  
   function() {  
     mui('.mui-off-canvas-wrap').offCanvas('show');  
   });  

  document.getElementById('list1').addEventListener('tap', function() {  

    mui.openWindow({  
        url:'processForm.html',  
        id:'processForm.html',

// styles:{
// top:'newpage-top-position',//新页面顶部位置
// bottom:'newage-bottom-position',//新页面底部位置
// width:newpage-width,//新页面宽度，默认为100%
// height:newpage-height,//新页面高度，默认为100%
// },
extras:{
},
show:{
autoShow:true,//页面loaded事件发生后自动显示，默认为true
aniShow:'slide-in-right',//页面显示动画，默认为”slide-in-right“；
duration:200//页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；
},
waiting:{
autoShow:true,//自动显示等待框，默认为true
title:'正在加载...',//等待对话框上显示的提示内容
options:{
width:100,//等待框背景区域宽度，默认根据内容自动计算合适宽度
height:100,//等待框背景区域高度，默认根据内容自动计算合适高度
}
}
})
}); 

  //待办事宜被点击  
  document.getElementById('dbsyLi').addEventListener('tap', function() {  

    mui.openWindow({  
        url:'waitingDoMatters.html',  
        id:'waitingDoMatters.html',  
        extras:{  
        },  
        show:{        
        autoShow:true,//页面loaded事件发生后自动显示，默认为true  
        aniShow:'slide-in-right',//页面显示动画，默认为”slide-in-right“；  
        duration:200//页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；  
        },  
        waiting:{  
        autoShow:true,//自动显示等待框，默认为true  
        title:'正在加载...',//等待对话框上显示的提示内容  
        options:{  
        width:100,//等待框背景区域宽度，默认根据内容自动计算合适宽度  
        height:100,//等待框背景区域高度，默认根据内容自动计算合适高度  
        }  
        }  
    })  
  });  
  //已办事宜被点击  
  document.getElementById('ybsyLi').addEventListener('tap', function() {  

    mui.openWindow({  
        url:'AlreadyDoMatters.html',  
        id:'AlreadyDoMatters.html',  
        extras:{  
            name:'已办事宜'  
        },  
        show:{        
        autoShow:true,//页面loaded事件发生后自动显示，默认为true  
        aniShow:'slide-in-right',//页面显示动画，默认为”slide-in-right“；  
        duration:200//页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；  
        },  
        waiting:{  
        autoShow:true,//自动显示等待框，默认为true  
        title:'正在加载...',//等待对话框上显示的提示内容  
        options:{  
        width:100,//等待框背景区域宽度，默认根据内容自动计算合适宽度  
        height:100,//等待框背景区域高度，默认根据内容自动计算合适高度  
        }  
        }  
    })  
  });  
  //我的请求被点击  
  document.getElementById('wdqqLi').addEventListener('tap', function() {  

    mui.openWindow({  
        url:'AlreadyDoMatters.html',  
        id:'AlreadyDoMatters.html',  
        extras:{  
            name:'我的请求'  
        },  
        show:{        
        autoShow:true,//页面loaded事件发生后自动显示，默认为true  
        aniShow:'slide-in-right',//页面显示动画，默认为”slide-in-right“；  
        duration:200//页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；  
        },  
        waiting:{  
        autoShow:true,//自动显示等待框，默认为true  
        title:'正在加载...',//等待对话框上显示的提示内容  
        options:{  
        width:100,//等待框背景区域宽度，默认根据内容自动计算合适宽度  
        height:100,//等待框背景区域高度，默认根据内容自动计算合适高度  
        }  
        }  
    })  
  });  
  //抄送事宜被点击  
  document.getElementById('cssyLi').addEventListener('tap', function() {  

    mui.openWindow({  
        url:'AlreadyDoMatters.html',  
        id:'AlreadyDoMatters.html',  
        extras:{  
            name:'抄送事宜'  
        },  
        show:{        
        autoShow:true,//页面loaded事件发生后自动显示，默认为true  
        aniShow:'slide-in-right',//页面显示动画，默认为”slide-in-right“；  
        duration:200//页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；  
        },  
        waiting:{  
        autoShow:true,//自动显示等待框，默认为true  
        title:'正在加载...',//等待对话框上显示的提示内容  
        options:{  
        width:100,//等待框背景区域宽度，默认根据内容自动计算合适宽度  
        height:100,//等待框背景区域高度，默认根据内容自动计算合适高度  
        }  
        }  
    })  
  });  
  //办结事宜被点击  
  document.getElementById('bjsyLi').addEventListener('tap', function() {  

    mui.openWindow({  
        url:'AlreadyDoMatters.html',  
        id:'AlreadyDoMatters.html',  
        extras:{  
            name:'办结事宜'  
        },  
        show:{        
        autoShow:true,//页面loaded事件发生后自动显示，默认为true  
        aniShow:'slide-in-right',//页面显示动画，默认为”slide-in-right“；  
        duration:200//页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；  
        },  
        waiting:{  
        autoShow:true,//自动显示等待框，默认为true  
        title:'正在加载...',//等待对话框上显示的提示内容  
        options:{  
        width:100,//等待框背景区域宽度，默认根据内容自动计算合适宽度  
        height:100,//等待框背景区域高度，默认根据内容自动计算合适高度  
        }  
        }  
    })  
  });  
  //新闻被点击  
  document.getElementById('xwLi').addEventListener('tap', function() {  

    mui.openWindow({  
        url:'news.html',  
        id:'news.html',  
        extras:{  
        },  
        show:{        
        autoShow:true,//页面loaded事件发生后自动显示，默认为true  
        aniShow:'slide-in-right',//页面显示动画，默认为”slide-in-right“；  
        duration:200//页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；  
        },  
        waiting:{  
        autoShow:true,//自动显示等待框，默认为true  
        title:'正在加载...',//等待对话框上显示的提示内容  
        options:{  
        width:100,//等待框背景区域宽度，默认根据内容自动计算合适宽度  
        height:100,//等待框背景区域高度，默认根据内容自动计算合适高度  
        }  
        }  
    })  
  });  
  //日程被点击  
  document.getElementById('rcLi').addEventListener('tap', function() {  

    mui.openWindow({  
        url:'schedule.html',  
        id:'schedule.html',  
        extras:{  
        },  
        show:{        
        autoShow:true,//页面loaded事件发生后自动显示，默认为true  
        aniShow:'slide-in-right',//页面显示动画，默认为”slide-in-right“；  
        duration:200//页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；  
        },  
        waiting:{  
        autoShow:true,//自动显示等待框，默认为true  
        title:'正在加载...',//等待对话框上显示的提示内容  
        options:{  
        width:100,//等待框背景区域宽度，默认根据内容自动计算合适宽度  
        height:100,//等待框背景区域高度，默认根据内容自动计算合适高度  
        }  
        }  
    })  
  });  
  //会议被点击  
  document.getElementById('hyLi').addEventListener('tap', function() {  

    mui.openWindow({  
        url:'meeting.html',  
        id:'meeting.html',  
        extras:{  
        },  
        show:{        
        autoShow:true,//页面loaded事件发生后自动显示，默认为true  
        aniShow:'slide-in-right',//页面显示动画，默认为”slide-in-right“；  
        duration:200//页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；  
        },  
        waiting:{  
        autoShow:true,//自动显示等待框，默认为true  
        title:'正在加载...',//等待对话框上显示的提示内容  
        options:{  
        width:100,//等待框背景区域宽度，默认根据内容自动计算合适宽度  
        height:100,//等待框背景区域高度，默认根据内容自动计算合适高度  
        }  
        }  
    })  
  });  
  //文档中心被点击  
  document.getElementById('wdzxLi').addEventListener('tap', function() {  

    mui.openWindow({  
        url:'word.html',  
        id:'word.html',  
        extras:{  
        },  
        show:{        
        autoShow:true,//页面loaded事件发生后自动显示，默认为true  
        aniShow:'slide-in-right',//页面显示动画，默认为”slide-in-right“；  
        duration:200//页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；  
        },  
        waiting:{  
        autoShow:true,//自动显示等待框，默认为true  
        title:'正在加载...',//等待对话框上显示的提示内容  
        options:{  
        width:100,//等待框背景区域宽度，默认根据内容自动计算合适宽度  
        height:100,//等待框背景区域高度，默认根据内容自动计算合适高度  
        }  
        }  
    })  
  });  

</script>

</body>

</html>

上面是代码，能帮我看看是怎么回事儿吗？求大神，iOS和web都能正常使用，安卓打死都不能滑动，但是去除上拉加载下拉刷新以后，安卓就能正常滑动了，求大神帮忙看看！！

2017-01-13 17:13 负责人:无 分享

没有找到相关结果

    已邀请:
    1***@qq.com

    1***@qq.com

    求解决啊 大神 同求

    2017-08-18 17:08 分享
    前端打工人

    前端打工人

    大神解决了没啊？

    2017-08-27 09:28 分享

    • 1***@qq.com

      ios 和安卓 都用单webview模式就可以解决问题； ios 和安卓使用双webview时 处理下拉时一个是拉动div 一个是拉动整个webview 兼容不太好处理

      2017-11-03 09:36

    评论 取消
    前端小白板

    前端小白板 - 小白

    请问楼主安卓上拉加载这个问题解决了吗

    2018-08-27 10:56 分享
    2***@qq.com

    2***@qq.com

    安卓手机初始化scroll组件后就会这样，原因不详

    2018-09-18 09:13 分享
    zyHome

    zyHome

    尝试在安卓环境下去除mui滚动组件的两个class （mui-scroll-wrapper scroll），
    ios的时候再加上。

    2018-09-19 13:52 分享
    1***@qq.com

    1***@qq.com

    楼主解决了没啊 同求

    2017-02-28 12:19 分享
    Neil_HL

    Neil_HL

    你写的太乱啦，看不清，把你的代码上传看看，，，还有就是安卓和ios的下拉刷新是不一样的，安卓使用的是webview，ios用的是div方式，web电脑商也是用的div方式。http://dev.dcloud.net.cn/mui/pulldown/

    2017-02-28 16:52 分享

    • 1***@qq.com

      能否提供安卓的demo

      2017-03-21 13:14

    评论 取消
    为什么被折叠? 0 个回复被折叠

    该问题目前已经被锁定, 无法添加新回复

    退出全屏模式 全屏模式 回复
    友情链接
    优势智云 黑马程序员 程序员客栈 个推 锐亚教育 即速应用 DCloud新闻 InfoQ 蓝莺IM HeapDump性能社区 diygw可视化 申请友链

    DCloud 即数字天堂(北京)网络技术有限公司是W3C成员及HTML5中国产业联盟发起单位

    京ICP备12046007号-4 | 京公网安备：11010802035340号 | 国家信息安全等级保护三级，证书编号：11010813802-20001

    | | 违法违规信息举报