jQuery插件jPaginate实现无刷新分页_jquery

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

PHP读取第一页数据：

<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.jb51.net/js/' . $row['id'] . '.html" target="_blank">' . $row['title'] . '</a></p>';
  }
  mysql_close();
  ?>
</div>

jQuery

$("#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.jb51.net/js/' . $row['id'] . '.html" target="_blank">' . $row['title'] . '</a></p>';
  }
}

以上所述就是本文的全部内容了，希望大家能够喜欢。

以上是小编为您精心准备的的内容，在的博客、问答、公众号、人物、课程等栏目也有的相关内容，欢迎继续使用右上角搜索按钮进行搜索jquery
， 无刷新分页
jpaginate
jquery无刷新分页插件、jpaginate 分页、jpaginate ajax分页、jquery无刷新分页、php jquery无刷新分页，以便于您获取更多的相关知识。