thinkpHP+LayUI 스 트림 로 딩 실현 기능
<div class="layui-container" id="container"> </div>
js,layui.js 도입
layui.use('flow', function() {
var $ = layui.jquery;
var flow = layui.flow;
flow.load({
elem: '#container' //
// , , 。
,done: function(page, next){ //
console.log(page)
//
setTimeout(function(){
var lis = [];
var url = "/index/index/ajaxNews/?page="+page
$.get(url,function (res) {
layui.each(res.msg.data, function(index, item) {
lis.push('<div class="layui-row list">\
<a href="newsDesc/id/'+item.id+'" rel="external nofollow" >\
<div class="layui-col-xs4 layui-col-sm4 ">\
<img src="'+item.cover_img+'">\
</div>\
<div class="layui-col-xs7 layui-col-sm7 right">\
<div class="title">'+item.title+'</div>\
<div class="intro">'+item.intro+'</div>\
</div>\
</a>\
</div>\
<hr/> ');
});// html
//pages Ajax , ,
next(lis.join(''), page <= res.msg.pages);
})
}, 300);
}
});
});
</script>
php 컨트롤 러 컨트롤 러
public function ajaxNews()
{
$page = input('page'); //
$pagesize = 6;
$list['data'] = model('Index')->getNewsList($page,$pagesize);
$count= model('Index')->getNewsCount();
$list['pages'] = ceil($count/$pagesize);
if ($list) {
return return_succ($list);
}else{
return return_error(' ');
}
}
php 모델 모델
//
public function getNewsList($page,$pagesize)
{
$list = Db::name('news')
->field('id,title,intro,cover_img')
->order('create_time desc')
->where(['status'=>0])
->page($page,$pagesize)
->select();
return $list;
}
//
public function getNewsCount()
{
$count = Db::name('news')->where(['status'=>0])->count();
return $count;
}
총결산위 에서 말 한 것 은 편집장 님 께 서 소개 해 주신 thinkpHP+LayUI 스 트림 로 딩 실현 기능 입 니 다.여러분 께 도움 이 되 셨 으 면 좋 겠 습 니 다.궁금 한 점 이 있 으 시 면 메 시 지 를 남 겨 주세요.편집장 님 께 서 바로 답 해 드 리 겠 습 니 다.여기 서도 저희 사이트 에 대한 여러분 의 지지 에 감 사 드 립 니 다!
만약 당신 이 본문 이 당신 에 게 도움 이 된다 고 생각한다 면,전 재 를 환영 합 니 다.번 거 로 우 시 겠 지만 출처 를 밝 혀 주 십시오.감사합니다!
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
thinkpHP 프레임 워 크 의 layer.js 패키지 및 사용 방법 예시이 글 의 사례 는 thinkpHP 프레임 워 크 에서 layer.js 의 패 키 징 과 사용 방법 을 다 루 었 다.여러분 께 참고 하도록 공유 하 겠 습 니 다.구체 적 으로 는 다음 과 같 습 니 다. v 층:...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.