jquery 翻页分页-freejs.net代码演示

首页>>分页>>jquery 翻页分页(2013-09-05)

jquery 翻页分页

$item_per_page=2;设置每页显示个数

数据库表

CREATE TABLE `content` (

`id` int(11) NOT NULL auto_increment,

`name` varchar(200) collate utf8_unicode_ci NOT NULL,

`classid` int(11) NOT NULL,

`message` varchar(3000) collate utf8_unicode_ci NOT NULL,

`updatetime` datetime NOT NULL,

PRIMARY KEY (`id`)

) ENGINE=MyISAM DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci AUTO_INCREMENT=11 ;

index.php

XML/HTML Code复制内容到剪贴板

<?php
include("conn.php");
$item_per_page = 2;
$results = mysql_query("SELECT COUNT(*) FROM content");
$get_total_rows = mysql_fetch_array($results); //total records
//echo $get_total_rows[0];
//
$pages = ceil($get_total_rows[0]/$item_per_page)+1;
//
if($pages > 1)
{
$pagination = '';
$pagination .= '<ul class="paginate">';
for($i = 1; $i<$pages; $i++)
{
$pagination .= '<li><a href="#" class="paginate_click" id="'.$i.'-page">'.$i.'</a></li>';
}
$pagination .= '</ul>';
}
?>
<script type="text/javascript" src="js/jquery-1.9.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#results").load("fetch_pages.php", {'page':0}, function() {$("#1-page").addClass('active');}); //
$(".paginate_click").click(function (e) {
$("#results").prepend('<div class="loading-indication"><img src="ajax-loader.gif" /> Loading...</div>');
var clicked_id = $(this).attr("id").split("-"); //
var page_num = parseInt(clicked_id[0]); //
$('.paginate_click').removeClass('active'); //
$("#results").load("fetch_pages.php", {'page':(page_num-1)}, function(){
});
$(this).addClass('active'); //
return false; //
});
});
</script>
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="results"></div>
<?php echo $pagination; ?>

fetch_pages.php

XML/HTML Code复制内容到剪贴板

<?php
include("conn.php");
$item_per_page = 2;
//sanitize post value
$page_number = filter_var($_POST["page"], FILTER_SANITIZE_NUMBER_INT, FILTER_FLAG_STRIP_HIGH);
//validate page number is really numaric
if(!is_numeric($page_number)){die('Invalid page number!');}
//get current starting point of records
$position = ($page_number * $item_per_page);
//Limit our results within a specified range.
$results = mysql_query("SELECT id,name,message FROM content ORDER BY id ASC LIMIT $position, $item_per_page");
//output results from database
echo '<ul class="page_result">';
while($row = mysql_fetch_array($results))
{
echo '<li id="item_'.$row["id"].'">'.$row["id"].'. <span class="page_name">'.$row["name"].'</span><Br><span class="page_message">'.$row["message"].'</span></li>';
}
echo '</ul>';
?>