详细问题描述
下拉加载更多的时候在网页和苹果上正常android上加载不出数据
重现步骤
要引入的页面 页面的名字:ajax_announcemenwater.jsp
<div class="mui-content">
<!--下拉刷新容器-->
<div id="pullrefresh" class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
<div class="mui-card" >
<div class="mui-card-header mui-card-media" style="height:40vw;background-image:url(app/resource/images/announcementWatertop.jpg)"></div>
</div>
<!--数据列表-->
<ul class="mui-table-view mui-table-view-chevron" id="mainthing">
</ul>
</div>
</div>
</div>
<script src="app/resource/js/mui.min.js"></script>
<script>
mui.init({
pullRefresh: {
container: '#pullrefresh',
/* down: {
callback: pulldownRefresh
}, */
up: {
contentrefresh: '正在加载...',
callback: pullupRefresh
}
}
});
/**
* 下拉刷新具体业务实现
*/
mui('body').on('tap','a',function(){document.location.href=this.href;});
var resultid=0;
function pulldownRefresh() {
$.post("plugins/wechatpage.action?method=announcementWater", function(result) {
var mList=result.data;
setTimeout(function() {
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
for (var i = 0, len = i + 2; i < len; i++) {
resultid=resultid+1;
if(resultid<mList.length){
var a="";
var li = document.createElement('li');
li.className = 'mui-table-view-cell';
a="<a class='mui-navigate-right' href='plugins/wechat.action?method=announcementWater&id="+mList[resultid].id+"''>";
a=a+"<img class='mui-media-object mui-pull-left' src='app/resource/images/announcementWaterleft.jpg'>";
a=a+"<div class='mui-media-body'>";
a=a+mList[resultid].title;
a=a+"<p class='mui-ellipsis'>"+mList[resultid].releasetime+"</p>";
a=a+"</div>";
li.innerHTML =a;
//下拉刷新,新纪录插到最前面;
table.insertBefore(li, table.firstChild);
}
}
mui('#pullrefresh').pullRefresh().endPulldownToRefresh(); //refresh completed
}, 1500);
});
}
var count = 0;
/**
* 上拉加载具体业务实现
*/
function pullupRefresh() {
$.post("plugins/wechatpage.action?method=announcementWater", function(result) {
var mList=result.data;
setTimeout(function() {
if(mList.length<resultid){
mui('#pullrefresh').pullRefresh().endPullupToRefresh(true); //参数为true代表没有更多数据了。
}else{
mui('#pullrefresh').pullRefresh().endPullupToRefresh(false); //参数为true代表没有更多数据了。
}
var table = document.body.querySelector('.mui-table-view');
var cells = document.body.querySelectorAll('.mui-table-view-cell');
for (var i = cells.length, len = i+8; i < len; i++) {
resultid=resultid+1;
if(resultid<mList.length){
var li = document.createElement('li');
li.className = 'mui-table-view-cell mui-media';
var ahref = document.createElement('a');
ahref.className = 'mui-navigate-right';
ahref.href ='plugins/wechat.action?method=announcementWater&id='+mList[resultid].id;
ahref.innerHTML="<img class='mui-media-object mui-pull-left' src='app/resource/images/announcementWaterleft.jpg'>";
var divbody = document.createElement('div');
divbody.className="mui-media-body";
divbody.innerHTML=mList[resultid].title+"<p class='mui-ellipsis'>"+mList[resultid].releasetime+"</p>"
ahref.append(divbody);
li.append(ahref);
table.appendChild(li);
}
}
}, 1500);
});
}
if (mui.os.plus) {
mui.plusReady(function() {
setTimeout(function() {
mui('#pullrefresh').pullRefresh().pullupLoading();
}, 1000);
});
} else {
mui.ready(function() {
mui('#pullrefresh').pullRefresh().pullupLoading();
});
}
</script>
运行环境
[系统版本]
[浏览器版本]
[IDE版本]
[mui版本]
外部的页面 页面的名字:ajax_announcemenwatermain.jsp
<body>
<div class="mui-content" id="message">
</div>
<script>
mui.init({
subpages:[{
url:"app/view/wechat/ajax_announcemenwater.jsp",//下拉刷新内容页面地址
id:"message",//内容页面标志
styles:{
/ top:subpage-top-position, ///内容页面顶部位置,需根据实际页面布局计算,若使用标准mui导航,顶部默认为48px;
}
}]
});
</script>
</body>
</html>
联系方式
[QQ]921996508
[电话]