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-12jQuery使用中可能被XSS攻擊的一些危險(xiǎn)環(huán)節(jié)提醒
XSS指的是跨站腳本攻擊,比如人們常說的向$傳入字符串或者字符串轉(zhuǎn)換可執(zhí)行函數(shù)等一些安全方面值得注意的細(xì)節(jié),下面就為大家整理了jQuery使用中可能被XSS攻擊的一些危險(xiǎn)環(huán)節(jié)提醒2016-05-05jQuery實(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-08jQuery移動(dòng)端日期(datedropper)和時(shí)間(timedropper)選擇器附源碼下載
今天我給大家介紹一款非常有趣的日期和時(shí)間選擇器,它分為日期選擇器datedropper以及時(shí)間選擇器timedropper,他們倆尤其適合在移動(dòng)端上應(yīng)用。感興趣的小伙伴一起學(xué)習(xí)吧2016-04-04