PHP+jPaginate插件制作无刷新分页实例

jPaginate是一款动感滚动分页插件,它的表现形式是像分页的按钮一样,有意思的是这些按钮却可以左右滚动,可以通过单击或
鼠标滑向点两侧的小箭头来控制按钮的左右滚动。
读取第一页数据:
<div id="pagetxt">
<?php
$query = mysql_query("select id,title,addtime from article order by id desc limit 0, 6");
while ($row = mysql_fetch_array($query)) {
$pubdate = date("Y-m-d", $row['addtime']);
echo '<p><span>' . $pubdate . '</span><a href="http://www.sucaihuo.com/js/' . $row['id'] . '.html" target="_blank">' . $row['title'] . '</a></p>';
}
mysql_close();
?>
</div>
分页参数:
$("#demo3").paginate({
count: <?php echo $page; ?>, //总记录数
start: 1, //开始显示的页数
display: 5, //分页条显示的页数
border: true, //是否显示页码的边框
border_color: '#BEF8B8', //设置边框的颜色
text_color: '#79B5E3', //设置页码的颜色
background_color: '#E3F2E1', //设置页码的背景色
border_hover_color: '#68BA64', //设置鼠标滑向页码时页码边框的颜色
text_hover_color: '#2573AF', //设置鼠标滑向页码时页码的颜色
background_hover_color: '#CAE6C6', //设置鼠标滑向页码时页码背景的颜色
images: false, //是否显示页码导航箭头
mouse: 'press', //设置为'press'时,当鼠标滑向导航箭头时,页码随之滚动;设置为'slide'时,鼠标单击一次导航箭头页码滚动一次。
onChange: function(page) { //当单击页码时,回调函数.
$("#pagetxt").load("article.php?p=" + page);
}
});
article.php代码:
$p = isset($_GET['p']) ? intval($_GET['p']) : "";
$result = mysql_query("select id from article");
$total = mysql_num_rows($result);
$pagesize = 6; //每页显示数
$page = ceil($total / $pagesize); //总页数
if ($p) {
$startPage = ($p - 1) * $pagesize;
$query = mysql_query("select id,title,addtime from article order by id desc limit $startPage, $pagesize");
while ($row = mysql_fetch_array($query)) {
$pubdate = date("Y-m-d", $row['addtime']);
echo '<p><span>' . $pubdate . '</span><a href="http://www.sucaihuo.com/js/' . $row['id'] . '.html" target="_blank">' . $row['title'] . '</a></p>';
}
}
本文转自:https://www.sucaihuo.com/php/95.html 转载请注明出处!
PHP+jPaginate插件制作无刷新分页实例的更多相关文章
- Thinkphp+Ajax带关键词搜索列表无刷新分页实例
Thinkphp+Ajax带关键词搜索列表无刷新分页实例,两个查询条件,分页和搜索关键字,懂的朋友还可以添加其他分页参数. 搜索#keyword和加载内容区域#ajax_lists <input ...
- Bootstrap Paginator分页插件+ajax 实现动态无刷新分页
之前做分页想过做淘宝的那个,但是因为是后台要求不高,就Bootstrap Paginator插件感觉还蛮容易上手,所以就选了它. Bootstrap Paginator分页插件下载地址: Downlo ...
- jquery ajax php+mysql 无刷新分页 详细实例
最近在接触jquery和ajax,当前项目也会用到分页,为了用户体验更好一些,就准备用无刷新分页,这个demo很适合新手学习查看,写的比较清晰,话不多说,直接上代码吧. 首先是html页面,index ...
- javascript;Jquery;获取JSON对象,无刷新分页,异步加载,异步删除,实例。
AjaxNewsList: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> < ...
- 扩展GridView实现的一个自定义无刷新分页,排序,支持多种数据源的控件TwfGridView
最近项目View层越来越趋向于无刷新化,特别是数据展示方面,还要对Linq有很好的支持.在WebFrom模式的开发中,GridView是一个功能很强大,很常用的控件,但是他也不是完美的,没有自带的无刷 ...
- 无刷新分页 jquery.pagination.js
无刷新分页 jquery.pagination.js 采用Jquery无刷新分页插件jquery.pagination.js实现无刷新分页效果 1.插件参数列表 http://www.dtan.so ...
- MVC简单分页(未实现无刷新分页)
分页Html辅助方法 using System.Text; using System.Web: using System.Web.Mvc; namespace System.Web.Mvc { pub ...
- 学习笔记之AJAX无刷新分页
利用AJAX实现无刷新分页技术原理: 其主要是利用AJAX的异步处理机制,实现数据的异步传递,它隐藏了客户端向服务端请求数据的状态,在客户端表现为无刷新的显示状态. 实现分页的步骤: 1.客服端点击页 ...
- 在Thinkphp中使用AJAX实现无刷新分页
在Thinkphp目录的Lib\ORG\Util\目录里新建AjaxPage.class.php,写入一下内容: <?php // +------------------------------ ...
随机推荐
- java通过递归统计文件大小
思路就是通过文件的遍历,对一个文件夹中的非目录文件进行大小统计,并对其中目录文件进行相同的遍历操作,代码如下: package word; import java.io.File; import ja ...
- linux基础之磁盘管理与文件系统
上面一篇文章(https://www.cnblogs.com/ckh2014/p/7224851.html)介绍了硬盘的基本结构,那么一块磁盘如何应用取存储数据呢? 它的步骤是这样的: 识别硬盘 -- ...
- 报表平台发行说明(V0.0.0.1)
开发周期:共20天(2019-11-04~2019-11-23) 发布日期:2019-11-23 主要功能说明: 1 整体功能技术选型,前端(html+CSS+javascript)+Web API ...
- 简单记账本APP开发二
今天主要是进行了适配器的编写,数据库的创建以及对完善了业务逻辑,简单的APP到此已经通过测试可以使用.
- Codeforces Round #624 (Div. 3)
A.题意:通过加奇数减偶数的操作从a到b最少需要几步 签到题 #include <algorithm> #include <iostream> #include <cst ...
- <转载> 撤销 git reset 操作
https://blog.csdn.net/mhlghy/article/details/84786497
- 【大道至简】NetCore3.1快速开发框架一:集成Swagger
在上一章节中,我们创建了基本的框架结构:https://www.cnblogs.com/fuyu-blog/p/12217647.html 下面我们测试接口和集成Swagger接口文档 一.接口测试 ...
- Unable to open debugger port (127.0.0.1:13249): java.net.BindException "Address already in use: JVM_Bind"
这个问题比较简单一点,Tomcat的端口被占用了,我使用的是IDEA里的一个热部署插件JReble,更新了IDEA之后就发现端口被占用了,可能我电脑没有重启过吧, 一直被占用着,所以解决方法就是更换一 ...
- AVR单片机丢固件原因分析和解决方案
一.硬件方面 除了下面列举的方面,还需要评估下其他措施. 1.电源因素,禁干扰. 只要用廉价劣质的开关电源,不管哪个单片机,都存在EEPROM丢数据和单片机程序丢失的情况. 1.转接板走线,直接接到了 ...
- 杭电oj_2058——The sum problem(java实现)
原题链接:http://acm.hdu.edu.cn/showproblem.php?pid=2058 思路:等差数列公式变形:sum = a1 * len + len *(len -1)/2 抽象成 ...