有一个list,所有的数据都是使用json写出来,使用ajax做的查询,这个json有12个数据,正常ajax查询出来的是这样的,看起来没有问题,但是我只要使用mui的下拉加载就出问题:
html 结构:
<div id="homeList" class="mui-slider-item mui-control-content mui-active">
<ul class="mui-table-view js-view js-pullRefresh">
<li class="mui-table-view-cell mui-media js-media">
<a href="javascript:;">
<img class="mui-media-object mui-pull-left js-img">
<div class="mui-media-body js-media-body">
<p class="anviz-ellipsis js-des"></p>
</div>
</a>
</li>
</ul>
</div>
现在我没有打开【下拉加载】的方法:
如果我现在打开这段注释的代码,就会出问题。把每条数据循环12条,每条数据描述部分再循环12条,我不知道这是哪里的问题:
把我写的ajax也贴出来,供大神们找问题,homoContent()这个方法在没有使用mui的下拉加载时是正常显示的:
mui.ready(function() {
homoContent();
})
function homoContent() {
var jsView = jQuery('.js-view');
var liObj = jsView.find('li').remove();
var url = "js/home/home.json";
//查询参数,因为是假数据,因此这个对象没有作为查询参数使用
var dataEntity = {
"userId": "00001",
"page": 1,
"size": 10
};
mui.ajax({
type: "GET",
url: url,
dataType: "json",
success: function(data) {
console.log('data' + data);
for(var i = 0; i < data.length; i++) {
var liContent = liObj.clone();
var item = data[i];
var p_img = item.productorImg;
var p_name = item.productorName;
var p_des = item.productorDes;
var p_url = item.productorUrl;
var divCon = liContent.find('.js-media-body');
var pCon = divCon.find('.js-des').text(p_des);
liContent.find('.js-img').attr('src', p_img);
liContent.find('a').attr('href', p_url);
divCon.text(p_name);
divCon.append(pCon);
jsView.append(liContent);
}
jsView.last().addClass('anviz-media');
},
error: function(data) {
mui.alert('Error 500--Internal Server Error!');
}
})
}