手机版

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

时间:2021-10-01 来源:互联网 编辑:宝哥软件园 浏览:

JPaginate是一个基于jQuery的动态滚动分页插件。它的表达就像分页按钮。非常有趣的是,这些按钮可以滚动。您可以通过单击或将鼠标滑动到点两侧的小箭头来控制按钮来回滚动。

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

$(elementID)。paginate()属性设置幸运的是,jPaginate提供了许多属性配置,因此您可以轻松自定义所需的分页效果。设置方法如:

$ (elementid)。分页({count:80,start:1,}) count:位数,记录总数。Start:开始显示的页数,例如,3表示从第3页开始。Display: number,分页栏显示的页数,例如:5表示一次显示5个页码。边框:是否显示页码的边框。(true/false)border_color:设置边框的颜色,如“#d3d3d3”。Text_color:设置页码的颜色,如“#68ba64”。Background_color:设置页码的背景色,如“#f7f7f7”。Border_hover_color:设置鼠标滑过页码时页码边框的颜色。Text_hover_color:设置鼠标滑过页码时的颜色。Background_hover_color:设置鼠标滑动到页码时页码背景的颜色。Images:当鼠标:设置为‘按下’时,是否显示页码的导航箭头(方向箭头)(真/假),当鼠标滑动到导航箭头时,页码会随之滚动;当设置为“滑动”时,单击一次导航箭头,滚动一次页码。OnChange:单击页码时,回调函数。示例应用:PHP jQuery实现Ajax分页效果。首先,准备index.php,它用于通过分页显示博客文章列表。1.参考JS:

脚本类型=' text/JavaScript ' src=' http : js/jquery . js '/脚本脚本脚本类型=' text/JavaScript ' src=' http : js/jquery . paginate . js '/脚本脚本脚本类型=' text/JavaScript ' $(function(){ $(' # demo ')。paginate({ count :php echo $ page?start : 1,display : 5,border : true,border_color : '#BEF8B8 ',text_color : '#79B5E3 ',background_color : '#E3F2E1 ',border _ hover _ color : ' # 68ba 64 ',text_hover_color : '#2573AF ',background _ hover _ color : ' # cae6c ',images 33333:load('article.php?id=' page);} });});/script注意,上面已经详细描述了插件的属性设置。属性计数通过PHP计算页面总数$page,这个参数由article.php获得。此外,onChange属性:当点击页码时,调用函数,实现页码参数异步提交给article.php处理。article.php通过阅读数据库中的表书并列出获得的文章返回页面。这是Ajax。当然,我只是在这里做一个简单的演示。如果需要更多的异步效果,可以参考jQuery来使用文档。2.引用CSS:jPaginate阴道官方提供的导航栏样式。也可以自己写一个很酷的风格。

Link rel='样式表' type=' text/CSS' href=' style。CSS'/3。index.php首页。要显示文章的初始列表,代码如下。

Class=' demo' h4demo3: PHP jquery实现AJAX分页效果/H4 DIV ID=' pagext '/div div ID=' demo '/div/div在ID为page XT的div中添加PHP代码:

$query=$db-select('article ',' id,title,pubdate ',' cata=1 order by id desc限制0,5 ');while($ row=$ db-fetch _ array($ query)){ $ pub date=date(' Y-m-d ',$ row[pub date]);echo ' PS pan $ pub date/spana href=' view-blog-'。$row[id]. "。html' target='_blank ' '。$row[title]。/a/p ';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);//总记录数$ page size=5;//每页显示数$ page=ceil($ total/$ page size);//总页数if(isset($ id)){ $起始页=($ id-1)* $页面大小;$query=$db-select('article ',' id,title,pubdate ',' cata=1个按id排列的订单desc限制$startPage,$ page size’);while($ row=$ db-fetch _ array($ query)){ $ pub date=date(' Y-m-d ',$ row[pub date]);echo ' PS pan $ pub date/spana href=' view-blog-' .$row[id]。"。html' target='_blank ' ' .$row[title]./a/p ';//输出文章列表} } 以上介绍了PHP jQuery实现埃阿斯分页效果中jPaginate插件的应用,希望对大家的学习有所帮助。

版权声明:PHP jQuery Ajax实现分页效果 jPaginate插件的应用是由宝哥软件园云端程序自动收集整理而来。如果本文侵犯了你的权益,请联系本站底部QQ或者邮箱删除。