我是根据HolleMUI上面的demo来的（pullrefresh_with_tab.html）；我其他的页面可以，就这个页面有问题。是css的问题还是怎么了？
我现在只能用
plus.nativeUI.toast("正在加载...");
plus.nativeUI.toast("暂时没有更多的信息了！");做控制！
<div class="mui-slider-group tse-slider-group">
<div id="item1mobile" class="mui-slider-item mui-control-content mui-active">
<div id="scroll1" class="mui-scroll-wrapper">
<div class="mui-scroll">
<!--图片轮播-->
<div id="slider1" class="mui-slider">
<div class="mui-slider-group mui-slider-loop">
<!-- 额外增加的一个节点(循环轮播：第一个节点是最后一张轮播) -->
<div class="mui-slider-item mui-slider-item-duplicate tse-click-auto">
<a href="#" class="auto11">
<img src="../images/w1.jpg">
</a>
</div>
<div class="mui-slider-item tse-click-auto">
<a href="#" id="auto8">
<img src="../images/d1.jpg" id="au8">
</a>
</div>
<div class="mui-slider-item tse-click-auto">
<a href="#" id="auto9">
<img src="../images/x1.jpg">
</a>
</div>
<div class="mui-slider-item tse-click-auto">
<a href="#" id="auto10">
<img src="../images/s1.jpg">
</a>
</div>
<div class="mui-slider-item tse-click-auto">
<a href="#" id="auto11">
<img src="../images/w1.jpg">
</a>
</div>
<!-- 额外增加的一个节点(循环轮播：最后一个节点是第一张轮播) -->
<div class="mui-slider-item mui-slider-item-duplicate tse-click-auto">
<a href="#" id="auto8">
<img src="../images/d1.jpg">
</a>
</div>
</div>
<div class="mui-slider-indicator">
<div class="mui-indicator mui-active"></div>
<div class="mui-indicator"></div>
<div class="mui-indicator"></div>
<div class="mui-indicator"></div>
</div>
</div>
<ul class="mui-table-view" id="tse-company1">
</ul>
</div>
</div>
</div>
<div id="item2mobile" class="mui-slider-item mui-control-content">
<div id="scroll2" class="mui-scroll-wrapper">
<div class="mui-scroll tse-scroll" title="activity">
<div class="mui-loading">
<div class="mui-spinner">
</div>
</div>
</div>
</div>
</div>
<div id="item3mobile" class="mui-slider-item mui-control-content">
<div id="scroll3" class="mui-scroll-wrapper">
<div class="mui-scroll tse-scroll" title="brand">
<div class="mui-loading">
<div class="mui-spinner">
</div>
</div>
</div>
</div>
</div>
</div>
下面是上拉加载js：
//阻尼系数
var deceleration = mui.os.ios?0.003:0.0009;
$('.mui-scroll-wrapper').scroll({
bounce: false,
indicators: false, //是否显示滚动条
deceleration:deceleration
});
$.ready(function() {
//循环初始化所有上拉加载。
$.each(document.querySelectorAll('.tse-slider-group .tse-scroll'),function(index, pullRefreshEl) {
$(pullRefreshEl).pullToRefresh({
up: {
contentrefresh : "正在加载...",//可选，正在加载状态时，上拉加载控件上显示的标题内容
contentnomore:'没有更多数据了',//可选，请求完毕若没有更多数据时显示的提醒内容；
callback: function() {
var self = this;
var ctype = '';
if(pullRefreshEl.getAttribute('title')){
ctype = pullRefreshEl.getAttribute('title');
}else{
ctype = '';
}
setTimeout(function() {
var ul = self.element.querySelector('.mui-table-view');
var length = ul.querySelectorAll('li').length;
var fragment = document.createDocumentFragment();
var li;
var htmlli = '';
mui.ajax({
url:urlCell,
type:'post',
data:{type:ctype,size:'5',offset:length},//{id:id}
dataType:'json',
timeout:10000,//超时时间设置为10秒；
success:function(result){
if(result['backStatus']!='-1'){
mui.each(result,function(index,item){
li = document.createElement('li');
li.className = 'mui-table-view-cell mui-media';
htmlli = "<a href='http://ask.dcloud.net.cn/a-detail' id='"+item['itemid']+"'>"+
"<img class='mui-media-object mui-pull-left' src='";
if(item['thumb']){
htmlli += item['thumb'];
}else{
htmlli += "../images/default_photo.png";
}
htmlli +="'>";
htmlli += "<div class='mui-media-body'>"+item['title']+
"<p class='mui-ellipsis'>"+item['introduce']+"</p>"+
"<p class='mui-ellipsis'>有效期："+item['totime']+"</p>"+
"<p class='mui-ellipsis'>主办方："+item['company']+"</p>"+
"</div></a>";
li.innerHTML = htmlli;
fragment.appendChild(li);
});
ul.appendChild(fragment);
self.endPullUpToRefresh();
plus.nativeUI.toast("正在加载...");
}else{
self.endPullUpToRefresh(true);
plus.nativeUI.toast("暂时没有更多的信息了！");
}
},
error:function(xhr,type,errorThrown){
//异常处理；
console.log(type);
}
});
}, 1000);
}
}
});
});
});
1 个回复
l***@foxmail.com
需要添加一些css
<!--标准mui.css-->
<link rel="stylesheet" href="../../css/mui.min.css">
<style>
html,
body {
background-color: #efeff4;
}
.mui-bar~.mui-content .mui-fullscreen {
top: 44px;
height: auto;
}
.mui-pull-top-tips {
position: absolute;
top: -20px;
left: 50%;
margin-left: -25px;
width: 40px;
height: 40px;
border-radius: 100%;
z-index: 1;
}
.mui-bar~.mui-pull-top-tips {
top: 24px;
}
.mui-pull-top-wrapper {
width: 42px;
height: 42px;
display: block;
text-align: center;
background-color: #efeff4;
border: 1px solid #ddd;
border-radius: 25px;
background-clip: padding-box;
box-shadow: 0 4px 10px #bbb;
overflow: hidden;
}
.mui-pull-top-tips.mui-transitioning {
-webkit-transition-duration: 200ms;
transition-duration: 200ms;
}
.mui-pull-top-tips .mui-pull-loading {
/-webkit-backface-visibility: hidden;
-webkit-transition-duration: 400ms;
transition-duration: 400ms;/