jQuery插件jPaginate實(shí)現(xiàn)無刷新分頁
jPaginate是基于jQuery的動(dòng)感滾動(dòng)分頁插件,它的表現(xiàn)形式是像分頁的按鈕一樣,非常有意思的是這些按鈕卻可以滾動(dòng),可以通過單擊或鼠標(biāo)滑向點(diǎn)兩側(cè)的小箭頭來控制按鈕的前后滾動(dòng)。

PHP讀取第一頁數(shù)據(jù):
<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.dbjr.com.cn/js/' . $row['id'] . '.html" target="_blank">' . $row['title'] . '</a></p>';
}
mysql_close();
?>
</div>
jQuery
$("#demo3").paginate({
count: <?php echo $page; ?>, //總記錄數(shù)
start: 1, //開始顯示的頁數(shù)
display: 5, //分頁條顯示的頁數(shù)
border: true, //是否顯示頁碼的邊框
border_color: '#BEF8B8', //設(shè)置邊框的顏色
text_color: '#79B5E3', //設(shè)置頁碼的顏色
background_color: '#E3F2E1', //設(shè)置頁碼的背景色
border_hover_color: '#68BA64', //設(shè)置鼠標(biāo)滑向頁碼時(shí)頁碼邊框的顏色
text_hover_color: '#2573AF', //設(shè)置鼠標(biāo)滑向頁碼時(shí)頁碼的顏色
background_hover_color: '#CAE6C6', //設(shè)置鼠標(biāo)滑向頁碼時(shí)頁碼背景的顏色
images: false, //是否顯示頁碼導(dǎo)航箭頭
mouse: 'press', //設(shè)置為'press'時(shí),當(dāng)鼠標(biāo)滑向?qū)Ш郊^時(shí),頁碼隨之滾動(dòng);設(shè)置為'slide'時(shí),鼠標(biāo)單擊一次導(dǎo)航箭頭頁碼滾動(dòng)一次。
onChange: function(page) { //當(dāng)單擊頁碼時(shí),回調(diào)函數(shù).
$("#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; //每頁顯示數(shù)
$page = ceil($total / $pagesize); //總頁數(shù)
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.dbjr.com.cn/js/' . $row['id'] . '.html" target="_blank">' . $row['title'] . '</a></p>';
}
}
以上所述就是本文的全部內(nèi)容了,希望大家能夠喜歡。
- jquery分頁插件jpaginate在IE中不兼容問題
- PHP+jQuery+Ajax實(shí)現(xiàn)分頁效果 jPaginate插件的應(yīng)用
- jQuery Pagination Ajax分頁插件(分頁切換時(shí)無刷新與延遲)中文翻譯版
- jquery分頁插件jquery.pagination.js使用方法解析
- 一款Jquery 分頁插件的改造方法(服務(wù)器端分頁)
- 最實(shí)用的jQuery分頁插件
- jQuery Pagination分頁插件使用方法詳解
- 快速掌握jquery分頁插件jqPaginator的使用方法
- jQuery ajax分頁插件實(shí)例代碼
- jquery+css3打造一款ajax分頁插件(自寫)
- 超好用的jQuery分頁插件jpaginate用法示例【附源碼下載】
相關(guān)文章
Jquery Easyui分割按鈕組件SplitButton使用詳解(17)
這篇文章主要為大家詳細(xì)介紹了Jquery Easyui分割按鈕組件SplitButton的使用方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-12-12
對(duì)稱加密與非對(duì)稱加密優(yōu)缺點(diǎn)詳解
本文主要介紹了對(duì)稱加密與非對(duì)稱加密的優(yōu)缺點(diǎn),具有一定的參考價(jià)值,下面跟著小編一起來看下吧2017-02-02
jQuery使用中可能被XSS攻擊的一些危險(xiǎn)環(huán)節(jié)提醒
XSS指的是跨站腳本攻擊,比如人們常說的向$傳入字符串或者字符串轉(zhuǎn)換可執(zhí)行函數(shù)等一些安全方面值得注意的細(xì)節(jié),下面就為大家整理了jQuery使用中可能被XSS攻擊的一些危險(xiǎn)環(huán)節(jié)提醒2016-05-05
jQuery實(shí)現(xiàn)的網(wǎng)頁豎向菜單效果代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)的網(wǎng)頁豎向菜單效果代碼,涉及jquery控制頁面元素簡單折疊與展開功能,非常簡單實(shí)用,需要的朋友可以參考下2015-08-08
下拉列表選擇項(xiàng)的選中在不同瀏覽器中的兼容性問題探討
使用jquery做了一個(gè)項(xiàng)目,下拉列表選擇項(xiàng)變化時(shí),獲取選中項(xiàng)的文本在不同瀏覽器中的兼容性問題在本文將為大家介紹下2013-09-09
解決jquery validate 驗(yàn)證不通過后驗(yàn)證正確的信息仍殘留在label上的方法
在本篇文章里小編給大家整理了關(guān)于解決jquery validate 驗(yàn)證不通過后驗(yàn)證正確的信息仍殘留在label上的方法,有需要的朋友們可以學(xué)習(xí)下。2019-08-08
jQuery移動(dòng)端日期(datedropper)和時(shí)間(timedropper)選擇器附源碼下載
今天我給大家介紹一款非常有趣的日期和時(shí)間選擇器,它分為日期選擇器datedropper以及時(shí)間選擇器timedropper,他們倆尤其適合在移動(dòng)端上應(yīng)用。感興趣的小伙伴一起學(xué)習(xí)吧2016-04-04

