jQuery插件分享之分頁(yè)插件jqPagination
更新時(shí)間：2014年06月06日 11:31:04 作者：
jqPagination 是一個(gè)簡(jiǎn)單易用的輕量級(jí) jQuery分頁(yè)插件，其使用了 HTML5 和 CSS3 技術(shù)來(lái)實(shí)現(xiàn)。此插件提供了幾個(gè)參數(shù)設(shè)置選項(xiàng)，通過(guò)簡(jiǎn)單的配置即可生成分頁(yè)控件。此外，它的外觀樣式是可自定義的，擴(kuò)展性很強(qiáng)。
使用方法：
添加 jQuery 類庫(kù)、jqPagination 插件的 JS 和 CSS 文件
復(fù)制代碼 代碼如下:
<link rel="stylesheet" href="jqpagination.css"/>
<script src="jquery-1.6.2.min.js"></script>
<script src="jquery.jqpagination.min.js"></script>
再需要如下HTML
復(fù)制代碼 代碼如下:
<div class="pagination">
<a href="#" class="first" data-action="first">«</a>
<a href="#" class="previous" data-action="previous">‹</a>
<input type="text" readonly="readonly" data-max-page="40" />
<a href="#" class="next" data-action="next">›</a>
<a href="#" class="last" data-action="last">»</a>
</div>
最后初始化插件
復(fù)制代碼 代碼如下:
$('.pagination').jqPagination({
link_string : '/?page={page_number}',
current_page: 5, //設(shè)置當(dāng)前頁(yè) 默認(rèn)為1
max_page : 40, //設(shè)置最大頁(yè) 默認(rèn)為1
page_string : '當(dāng)前第{current_page}頁(yè),共{max_page}頁(yè)',
paged : function(page) {
//回發(fā)事件。。。
}
});
您可能感興趣的文章:
- jQuery Pagination Ajax分頁(yè)插件(分頁(yè)切換時(shí)無(wú)刷新與延遲)中文翻譯版
- jquery分頁(yè)插件jquery.pagination.js使用方法解析
- Jquery 分頁(yè)插件之Jquery Pagination
- 最實(shí)用的jQuery分頁(yè)插件
- 分享一個(gè)自己動(dòng)手寫(xiě)的jQuery分頁(yè)插件
- Ajax分頁(yè)插件Pagination從前臺(tái)jQuery到后端java總結(jié)
- jQuery ajax分頁(yè)插件實(shí)例代碼
- 基于bootstrap3和jquery的分頁(yè)插件
- jquery ajax分頁(yè)插件的簡(jiǎn)單實(shí)現(xiàn)
- jquery+css3打造一款ajax分頁(yè)插件(自寫(xiě))
- 使用JQuery實(shí)現(xiàn)的分頁(yè)插件分享
- jQuery實(shí)現(xiàn)的分頁(yè)插件完整示例
相關(guān)文章
JQuery入門——事件切換之toggle()方法應(yīng)用介紹
在toggle()方法中，可以依次調(diào)用N個(gè)指定的函數(shù)，直到最后一個(gè)函數(shù)，然后重復(fù)對(duì)這個(gè)函數(shù)輪番調(diào)用,在函數(shù)之間切換調(diào)用的時(shí)候相當(dāng)?shù)姆奖?接下來(lái)將會(huì)詳細(xì)介紹toggle()方法的使用，感興趣的你可不要錯(cuò)過(guò)了啊2013-02-02
下面小編就為大家?guī)?lái)一篇輪播的簡(jiǎn)單實(shí)現(xiàn)方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-07-07
jquery實(shí)現(xiàn)帶縮略圖的全屏圖片畫(huà)廊效果實(shí)例
這篇文章主要介紹了jquery實(shí)現(xiàn)帶縮略圖的全屏圖片畫(huà)廊效果,實(shí)例分析了jquery帶縮略圖的全屏效果圖片實(shí)現(xiàn)技巧,并附有完整的源碼下載,需要的朋友可以參考下2015-06-06
JQuery 進(jìn)入頁(yè)面默認(rèn)給已賦值的復(fù)選框打鉤
這篇文章主要介紹了JQuery 進(jìn)入頁(yè)面默認(rèn)給已賦值的復(fù)選框打鉤的實(shí)現(xiàn)代碼，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下吧2017-03-03
眾所周知在jQuery中ready方法在DOM完全下載后立即執(zhí)行其中的代碼。因?yàn)樗堑人械腄OM元素都加載完畢，才執(zhí)行給定的函數(shù)，所以你能確定那些試圖操作和訪問(wèn)元素節(jié)點(diǎn)的方法都能被執(zhí)行。而這篇文章給大家介紹的是如何用jQuery的Read()方法代替原生JS，下面來(lái)一起看看。2016-11-11
為了提高加載速度，有個(gè)想法就是推遲外部JS加載，有興趣的朋友可以參考下，接下來(lái)詳細(xì)介紹實(shí)現(xiàn)方法2013-01-01
7款吸引人眼球的jQuery/CSS3特效實(shí)例分享
jQuery和CSS3對(duì)于web前端開(kāi)發(fā)肯定用得也比較多，接下來(lái)分享一些由jQuery和CSS3制作成的特效，希望對(duì)哪些喜歡學(xué)習(xí)特效的朋友有所幫助2013-04-04
本文介紹了Jquery頁(yè)面初始化的4種方式的實(shí)例代碼，需要的朋友可以看下2016-11-11
隨鼠標(biāo)上下滾動(dòng)，在某些時(shí)候需要類似的效果，下面有個(gè)不錯(cuò)的示例可以實(shí)現(xiàn)此效果，需要的朋友可以參考下2013-12-12
這種綁定方法會(huì)在整個(gè)document每pageinit一次,就對(duì)xxx進(jìn)行的某一事件進(jìn)行綁定,而pageinit事件什么時(shí)候會(huì)觸發(fā)，感興趣的朋友可以了解下2013-09-09