我再使用layui流加載的時候，圖片在第一次不加載出來，當第二次分頁的時候顯示資料，并且顯示到了顯示到第一次資料的位置
以下是我的代碼
$(function(){
var canvas=null;
var qrcode = null;
layui.use('flow', function(){
var flow = layui.flow;
var loadCount = 6;
var html = "";
var lis = [];
var totalCount = '';
flow.load({
elem: '#LAY_demo1', //流加載容器
/* scrollElem:"#LAY_demo1", */
end:'沒有更多資料展示啦',
isAuto:true,
done: function(page, next){ //執行下一頁的回呼
console.log(page);
$.ajax({
type: "post",
url: "${webRoot}/grid/gridHouseMgr/gridHouseMgrAction.do?actionType=generateCode&page="+page+"&loadCount="+loadCount,
success: function(val){
var result = eval("("+val+")");
totalCount = result.total;
lis = [];
layui.each(result.rows,function(index,item){
console.log(item);
item.ownerName = item.ownerName===undefined||item.ownerName==''?"無":item.ownerName;
item.ownerPhone = item.ownerPhone===undefined||item.ownerPhone==''?"無":item.ownerPhone;
qrcode= $('.code').qrcode(toUtf8(item.houseFullName)).hide();
canvas=qrcode.find('canvas').get(0);
/* console.log(qrcode.find('canvas').length); */
/* for (var i=0;i<qrcode.find('canvas').length;i++) {
} */
lis.push(
"<div>"
+" <div class='col-xs-4 yfymgl_col_xs_4'>"
+" <div class='yfym_item yfym_item_margin clearfix' >"
+"<div class='yfym_item_left'>"
/* +" <img class='yfym_item_left_img' src='https://img.uj5u.com/2020/09/15/77074150700492.png' alt='房屋二維碼圖示' onclick=\"showDiv('erweima')\">" */
+" <img class='yfym_item_left_img' alt='房屋二維碼圖示' onclick=\"showDiv('erweima')\">"
/* +" <p class='yfym_item_left_p'>"+item.buildingName+"|"+item+"|101</p>" */
+" <p class='yfym_item_left_p'>"+item.houseFullName+"</p>"
+"</div>"
+" <div class='yfym_item_right'>"
+" <p class='yfym_item_right_p'>房主姓名："+item.ownerName+"</p>"
+" <p class='yfym_item_right_p'>聯系電話："+item.ownerPhone+"</p>"
+"<div class='yfym_item_right_use'>"
+"<p class='yfym_item_right_use_p'>"
+" <span class='use_p_s1'>自住</span>"
+" <span class='use_p_s2'>|</span>"
+" <span class='use_p_s3'>租住</span>"
+" <span class='use_p_s2'>|</span>"
+" <span class='use_p_s3'>借住</span>"
+"<span class='use_p_s2'>|</span>"
+"<span class='use_p_s3'>空置</span>"
+" </p>"
+"</div>"
+"<div class='yfym_item_right_but'>"
+"<button class='right_but_01' onclick=\"showDiv('lookover')\">查看</button>"
+"<button class='right_but_02'>下載</button>"
+"</div>"
+"</div>"
+"</div>"
+"</div>"
+"</div>"
);
})
for (var i=0;i<qrcode.find('canvas').length;i++) {
$('.yfym_item_left_img').attr('src',qrcode.find('canvas')[i].toDataURL('image/jpg'))
console.log(qrcode.find('canvas')[i].toDataURL('image/jpg'));
}
next(lis.join(''), page <(totalCount+ loadCount-1)/loadCount);
}
});
}
});
});
})
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/43859.html
標籤：JavaScript