0

0

PHP+jQuery+Ajax实现分页效果 jPaginate插件的应用_PHP

php中文网

php中文网

发布时间:2016-05-30 08:44:27

|

1356人浏览过

|

来源于php中文网

原创

jpaginate是基于jquery的动感滚动分页插件,它的表现形式是像分页的按钮一样,非常有意思的是这些按钮却可以滚动,可以通过单击或鼠标滑向点两侧的小箭头来控制按钮的前后滚动。

 

调用jPaginate插件的方法很简单:

$(elementID).paginate() 

属性设置
可喜的是,jPaginate提供了很多属性配置,您可以轻易的定制想要的分页效果。
设置方法如:

$(elementID).paginate({ 
    count:80, 
    start:1, 
    ... }) 

count: 数字,总记录数。
start: 数字,开始显示的页数,如:3表示从第3页开始。
display: 数字,分页条显示的页数,如:5表示一次显示5个页码数。
border: 是否显示页码的边框。(true/false)
border_color: 设置边框的颜色,如"#d3d3d3"。
text_color: 设置页码的颜色,如"#68ba64"。
background_color: 设置页码的背景色,如"#f7f7f7"。
border_hover_color: 设置鼠标滑向页码时页码边框的颜色。
text_hover_color: 设置鼠标滑向页码时页码的颜色。
background_hover_color: 设置鼠标滑向页码时页码背景的颜色。
images: 是否显示页码导航箭头(方向箭头)(true/false)
mouse: 设置为'press'时,当鼠标滑向导航箭头时,页码随之滚动;设置为'slide'时,鼠标单击一次导航箭头页码滚动一次。
onChange: 当单击页码时,回调函数.
实例应用:PHP+jQuery实现Ajax分页效果
首先准备index.php,该页面用来分页展示一个博客文章列表。
1、引用JS:

 
 
 

注意,关于插件的属性设置,上文已详细介绍,属性count通过PHP计算出总页数$page,该参数由article.php得出。还要说明的是属性onChange:当点击页码时,调用函数,该函数实现了异步提交页码参数给article.php来处理,article.php通过读取数据库里的表书籍,并把得到的文章列表结果而返回页面,这就是Ajax。当然我这里只是做简单的演示,如果需要更多异步效果,可以参照jQuery使用文档。
2、引用CSS:
jPaginate官方提供了导航条样式,你也可以自己写个非常酷的样式。

 

3、index.php初始页面。
必须要显示一个初始的文章列表,代码如下

Demo 3: Php+jQuery实现AJAX 分页效果

在ID为pagetxt的DIV内加入PHP代码:

B2S商城系统
B2S商城系统

B2S商城系统B2S商城系统是由佳弗网络工作室凭借专业的技术、丰富的电子商务经验在第一时刻为最流行的分享式购物(或体验式购物)推出的开源程序。开发采用PHP+MYSQL数据库,独立编译模板、代码简洁、自由修改、安全高效、数据缓存等技术的应用,使其能在大浏览量的环境下快速稳定运行,切实节约网站成本,提升形象。注意:如果安装后页面打开出现找不到数据库等错误,请删除admin下的runtime文件夹和a

下载

$query=$db->select("article","id,title,pubdate","cata=1 order by id desc limit 0,5"); 
while($row=$db->fetch_array($query)){ 
   $pubdate=date("Y-m-d",$row[pubdate]); 
   echo "

$pubdate ".$row[title]."

";

4、article.php代码。

该代码用来获取index.php提交过来的页码,查询数据库,并将输出结果。代码如下:

include_once("common.php"); //连接数据库专用文件 
 
$id=$_GET['id']; //获取页码 
$result = $db->select("article", "id", "cata=1"); 
$total = $db->db_num_rows($result); //总记录数 
 
$pagesize=5; //每页显示数 
$page=ceil($total/$pagesize); //总页数 
if(isset($id)){ 
  $startPage=($id-1)*$pagesize; 
  $query=$db->select("article","id,title,pubdate","cata=1 order by id desc limit $startPage, 
$pagesize"); 
  while($row=$db->fetch_array($query)){ 
   $pubdate=date("Y-m-d",$row[pubdate]); 
   echo "

$pubdate ".$row[title]."

"; //输出文章列表 } }

以上介绍了PHP+jQuery实现Ajax分页效果中jPaginate插件的应用,希望对大家的学习有所帮助。

相关文章

PHP速学教程(入门到精通)
PHP速学教程(入门到精通)

PHP怎么学习?PHP怎么入门?PHP在哪学?PHP怎么学才快?不用担心,这里为大家提供了PHP速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
全国统一发票查询平台入口合集
全国统一发票查询平台入口合集

本专题整合了全国统一发票查询入口地址合集,阅读专题下面的文章了解更多详细入口。

12

2026.02.03

短剧入口地址汇总
短剧入口地址汇总

本专题整合了短剧app推荐平台,阅读专题下面的文章了解更多详细入口。

19

2026.02.03

植物大战僵尸版本入口地址汇总
植物大战僵尸版本入口地址汇总

本专题整合了植物大战僵尸版本入口地址汇总,前往文章中寻找想要的答案。

11

2026.02.03

c语言中/相关合集
c语言中/相关合集

本专题整合了c语言中/的用法、含义解释。阅读专题下面的文章了解更多详细内容。

2

2026.02.03

漫蛙漫画网页版入口与正版在线阅读 漫蛙MANWA官网访问专题
漫蛙漫画网页版入口与正版在线阅读 漫蛙MANWA官网访问专题

本专题围绕漫蛙漫画(Manwa / Manwa2)官网网页版入口进行整理,涵盖漫蛙漫画官方主页访问方式、网页版在线阅读入口、台版正版漫画浏览说明及基础使用指引,帮助用户快速进入漫蛙漫画官网,稳定在线阅读正版漫画内容,避免误入非官方页面。

8

2026.02.03

Yandex官网入口与俄罗斯搜索引擎访问指南 Yandex中文登录与网页版入口
Yandex官网入口与俄罗斯搜索引擎访问指南 Yandex中文登录与网页版入口

本专题汇总了俄罗斯知名搜索引擎 Yandex 的官网入口、免登录访问地址、中文登录方法与网页版使用指南,帮助用户稳定访问 Yandex 官网,并提供一站式入口汇总。无论是登录入口还是在线搜索,用户都能快速获取最新稳定的访问链接与使用指南。

92

2026.02.03

Java 设计模式与重构实践
Java 设计模式与重构实践

本专题专注讲解 Java 中常用的设计模式,包括单例模式、工厂模式、观察者模式、策略模式等,并结合代码重构实践,帮助学习者掌握 如何运用设计模式优化代码结构,提高代码的可读性、可维护性和扩展性。通过具体示例,展示设计模式如何解决实际开发中的复杂问题。

2

2026.02.03

C# 并发与异步编程
C# 并发与异步编程

本专题系统讲解 C# 异步编程与并发控制,重点介绍 async 和 await 关键字、Task 类、线程池管理、并发数据结构、死锁与线程安全问题。通过多个实战项目,帮助学习者掌握 如何在 C# 中编写高效的异步代码,提升应用的并发性能与响应速度。

2

2026.02.03

Python 强化学习与深度Q网络(DQN)
Python 强化学习与深度Q网络(DQN)

本专题深入讲解 Python 在强化学习(Reinforcement Learning)中的应用,重点介绍 深度Q网络(DQN) 及其实现方法,涵盖 Q-learning 算法、深度学习与神经网络的结合、环境模拟与奖励机制设计、探索与利用的平衡等。通过构建一个简单的游戏AI,帮助学习者掌握 如何使用 Python 训练智能体在动态环境中作出决策。

2

2026.02.03

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
jQuery 教程
jQuery 教程

共42课时 | 5.4万人学习

HTML+CSS基础与实战
HTML+CSS基础与实战

共132课时 | 10.2万人学习

tp6+adminlte搭建通用后台
tp6+adminlte搭建通用后台

共39课时 | 5.8万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号