<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="../css/mui.min.css" rel="stylesheet" />
</head>
<body>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 id="title" class="mui-title">分页</h1>
</header>
<div class="mui-content mui-scroll-wrapper" id="pagena">
<div class="mui-scroll">
<ul class="mui-table-view mui-table-view-chevron" id="listo">
</ul>
</div>
</div>
<script src="../js/mui.min.js"></script>
<script type="text/javascript">
var page=1;
mui.get(
'http://192.168.1.25:81/mysite/supply.php',
{act:'list',
page:page
},
function(result){
var str='';
mui.each(result['data'],function(index,items){
str +='<li class="mui-table-view-cell mui-control-item">'+items.sortname+'</li>';
});
document.getElementById('listo').innerHTML=str;
},
'json'
);
mui.init({
swipeBack: true,
pullRefresh: {
container: '#pagena',
down: {
style: 'circle',
color:'#2BD009', //可选,默认“#2BD009” 下拉刷新控件颜色
height:50,//可选,默认50.触发下拉刷新拖动距离,
offset: '0px',
// auto: true,
callback:pulldownRefresh
}
}
});
function pulldownRefresh() {
setTimeout(function() {
if(page>3){
page==1;
}
++page;
mui.get(
'http://192.168.1.25:81/mysite/supply.php',
{act:'list',
page:page
},
function(result){
var str='';
mui.each(result.data,function(index,items){
str +='<li class="mui-table-view-cell mui-control-item">'+items.sortname+'</li>';
});
document.getElementById('listo').innerHTML=str;
},
'json'
);
mui('#pagena').pullRefresh().endPulldownToRefresh();
// mui('#pagena').pullRefresh().endPulldown();
}, 1500);
}
</script>
</body>
</html>
芭蕉雨 (作者)
我看了mui下拉刷新文档,修改了一下,只能在浏览器中显示效果,Android手机上没有反应,这个是我修改后的代码
<body>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 id="title" class="mui-title">分页</h1>
</header>
// auto: true,
callback:pulldownRefresh
}
}
// mui('#pagena').pullRefresh().endPulldown();
2017-06-24 08:58