TP5无刷新点击加载更多
发布时间：2021-07-28 12:24:11
来源：
HTML代码
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
|
<div class="famous qc-default">
<div class="qc-g">
<div class="qc-title clear">
<h3>文章列表</h3>
</div>
<div class="list">
<ul>
{volist name="list" id="vo" }
<li><a href="/news-detail-{$vo['id']}.html">
<div class="pic">
<img src="{$vo['photo']}" alt="">
</div>
<div class="txt">
<h3>{$vo['name']}</h3>
<p>{$vo['summary']}</p>
</div></a>
</li>
{/volist}
</ul>
</div>
</div>
</div>
<a href="javascript：void(0);" class="click-more">点击加载更多</a>
<script>
var yema=2;
$('.click-more').click(function () {
var page={$page};
var $btn = $(this);
$btn.html('loading');
if(page<yema){
$btn.html('没有更多了');
}
else{
$.ajax({
type: "post",
url: "/introduce-get_list.html",
data: {p:yema},
success:function(json){
if(json.status==1){
yema++;
setTimeout(function(){
$btn.html('点击加载更多');
var data="";
for(i=0;i<json.content.length;i++){
data+=`
<li>
<a href="/news-detail-${json.content[i].id}.html">
<div class="pic">
<img src="${json.content[i].photo}" alt="">
</div>
<div class="txt">
<h3>${json.content[i].name}</h3>
<p>${json.content[i].summary}</p>
</div>
</a>
</li>
`;
}
$('.list>ul').append(data);
//yema++;
}, 1000);
}
},error:function(jqXHR, textStatus, errorThrown){
alert(textStatus);
},
})
}
});
</script>
|
php代码
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
|
public function introduce_list($p='1')
{
$where['column']=['eq','34'];
$where['status']=['eq','1'];
$where['enable']=['eq','1'];
$page_num='6';
$list=Db::name('table')->where($where)->order('sort desc ,id desc')->page($p,$page_num)->select();
return json(array('status'=>'1','message'=>'成功','content'=>$list));
}
|
