分页实现图

可以看到,我这里须要两部分分页,一个是初始化分页,另一个是搜索后结果分页呈现。
这是一个网站项目,利用了MVC框架CI来开拓,所用措辞为php,html、js、ajax。
分页插件是pagination.js 2.1.2。
首先引入pagination.js和pagination.css。

一、初始化分页

php数据库html图片分页显示网站开辟数据分页显示 PHP
(图片来自网络侵删)

加载网页的同时,所要呈现的数据传到了网页,controller里面的代码如图

在适当位置放置一个块,用来放分页,我的是:

html代码

这个时候就可以去写JS代码了,还是直接放代码:

初始化分页js代码

之前忘了说,我也用了Jquery,可以看到,分页分为两步,首先要得到源数据,然后将数据分页显示。

二、查询结果的分页显示

由于要搜索,自然要先传用户输入的数据,再吸收返回的数据,我这里是根据比赛名称来搜索的,还是直接上代码:

搜索的models代码

搜索的controller代码

然后就到如何分页的js代码了

搜索的分页实当代码

源数据我是同过一个函数返回得到的,这个函数通过Ajax获取用户要搜索的数据信息。
然后便是将数据分页呈现了,给个实现截图:

搜索分页的实现图

有什么疑问,记得在评论区留言哦。