thinkphp3.2 ajax返回页面（一）

2017-04-11 本文已影响9人响呼雷

新手，勿喷！！！

首先，基于thinkphp分页，上代码：

一、我写了一个function.php：

functiongetpage($count,$pagesize=20) {//$count（参数一，表示数据的总数量），$pagesizs(参数二，表示你一页显示多少条数据)

$p=new Think\Page($count,$pagesize);

$p->setConfig('header','

共

%TOTAL_ROW%

条记录第

%NOW_PAGE%

页/共

%TOTAL_PAGE%

页

');

$p->setConfig('prev','上一页');

$p->setConfig('next','下一页');

$p->setConfig('last','末页');

$p->setConfig('first','首页');

$p->setConfig('theme','%FIRST%%UP_PAGE%%LINK_PAGE%%DOWN_PAGE%%END%%HEADER%');

$p->lastSuffix=false;//最后一页不显示为总页数

return $p;

}

二、控制器memberController.class.php

public function shouyinyuan(){

$cashier= M('Cashier');//模型，这个不用解释

$count=$cashier->count();//获取数据表里面的总数量

$p= getpage($count,20);//调用上面的function.php的方法，传两个参数进去

if($count<=20) {//这里我判断<=20是因为在查询出来的数据超过20条，看效果图：

否则的话：

这个是>20的情况

$list=$cashier->select();//查询数据,这里你可以添加字的where条件

$this->assign('list',$list);

$this->assign('page',$p->show());// 赋值分页输出

$this->display();

}else{

$list=$cashier->order("id")->limit($p->firstRow.','.$p->listRows)->select();

$this->assign('list',$list);// 赋值数据集

$this->assign('page',$p->show());// 赋值分页输出

$this->display();

}

三、ajax处理

$(function(){

$('#ul4').on('click','.jspage a',function(){//#ul4是你获取到的数据要显示在哪里，这里给a标签绑定一个事件

$.ajax({

type:'get',

url:$(this).attr('href'),

success:function(data){

$('#ul4').html(data);

}

});

return false;

});

$(function() {//这个位置一定要放在最下面、要不然话的会不执行a标签的路径

$('.jspage a').trigger('click');

});

到这里，大家会问：你的a标签是那里的？

四、html页面

#ul4是哪个？a标签是哪个？如图：

这个大家应该看的很清楚了，ul4有了，a标签也有了

问题来了，你的ajax里面执行了a标签的href，那你的shouyiyuan.html在哪？下面来了

这里面只需要你编写数据的标签即可，不需要head，title，body什么的多余标签了

五、css

.pages a,.pages span{

display:inline-block;

padding:2px5px;

margin:0 1px;

border:1px solid#f0f0f0;

-webkit-border-radius:3px;

-moz-border-radius:3px;

border-radius:3px;

}

.pages a,.pages li{

display:inline-block;

list-style:none;

text-decoration:none; color:#58A0D3;

}

.pages a.first,.pages a.prev,.pages a.next,.pages a.end{

margin:0;

}

.pages a:hover{

border-color:#50A8E6;

}

.pages span.current{

background:#50A8E6;

color:#FFF;

font-weight:700;