html代码
<div class="container-fluid">
<!-- 开始 隐藏的div 复制他 -->
<div class="col-md-3 col-lg-3 col-sm-6 col-xs-12 item_box " id="item" style="display: none">
<div class="title">{$v.title}</div>
<div class="cont">
<p>{$v.content}</p>
<div class="bot">{$v.price}</div>
</div>
</div>
<!-- 结束 -->
<div class="row itm_box clone" id="clone">
<foreach name="res" item="v">
<div class="col-md-3 col-lg-3 col-sm-6 col-xs-12 item_box">
<div class="title">{$v.title}</div>
<div class="cont">
<p>{$v.content}</p>
<div class="bot">{$v.price}</div>
</div>
</div>
</foreach>
</div>
<ul class="page">
<li class="prv">上一页</li>
<li class="next st">下一页</li>
</ul>
</div>
js代码
<script>
var page = 2;
function pagee(){
$.post("{:U('Home/index/ajax')}",{page:page},function(data){
if(data.code == 400){
// alert('没有了');
}else if(data.code == 200){
$('#clone .item_box').each(function(){
//遍历删除模块
$(this).remove();
})
for (var i = data.data.length - 1; i >= 0; i--) {
//遍历
var newDiv = $('#item').clone();//克隆
newDiv.show();//显示
newDiv.find('.title').html(data.data[i]['title']);//赋值
newDiv.find('.cont').find('p').html(data.data[i]['content']);
newDiv.find('.bot').html(data.data[i]['price']);
$('.clone').append(newDiv);//插入
}
page++;
}
})
}
$('.next').click(function(){
//点击下一页
pagee();
})
$('.prv').click(function(){
//点击上一页
page = page - 1;
if(page <= 2){
page = 2;
}
$.post("{:U('Home/index/ajaxprv')}",{page:page},function(data){
if(data.code == 400){
// alert('没有了');
}else if(data.code == 200){
$('#clone .item_box').each(function(){
$(this).remove();
})
for (var i = data.data.length - 1; i >= 0; i--) {
var newDiv = $('#item').clone();
newDiv.show();
newDiv.find('.title').html(data.data[i]['title']);
newDiv.find('.cont').find('p').html(data.data[i]['content']);
newDiv.find('.bot').html(data.data[i]['price']);
$('.clone').append(newDiv);
}
}
})
})
</script>
php代码
<?php
namespace Home\Controller;
use Think\Controller;
class IndexController extends Controller {
public function index(){
$page = 0;
$res = M('yewu')->order('add_time desc')->limit($page,4)->select();
$this->assign('res',$res);
$this->display();
}
public function ajax(){
$po = ($_POST['page']-1)*4;
$res = M('yewu')->order('add_time desc')->limit($po,4)->select();
if($res){
$data['code'] = 200;
$data['data'] = $res;
}else{
$data['code'] = 400;
}
$this->ajaxReturn($data);
}
public function ajaxprv(){
$po = ($_POST['page']-2)*4;
$res = M('yewu')->order('add_time desc')->limit($po,4)->select();
if($res){
$data['code'] = 200;
$data['data'] = $res;
}else{
$data['code'] = 400;
}
$this->ajaxReturn($data);
}
}