jquery中分頁插件smartpaginator怎么用

這篇文章主要為大家展示了“jquery中分頁插件smartpaginator怎么用”，內(nèi)容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“jquery中分頁插件smartpaginator怎么用”這篇文章吧。

創(chuàng)新互聯(lián)公司專注于長安企業(yè)網(wǎng)站建設(shè),響應(yīng)式網(wǎng)站,購物商城網(wǎng)站建設(shè)。長安網(wǎng)站建設(shè)公司,為長安等地區(qū)提供建站服務(wù)。全流程按需求定制制作，專業(yè)設(shè)計(jì)，全程項(xiàng)目跟蹤，創(chuàng)新互聯(lián)公司專業(yè)和態(tài)度為您提供的服務(wù)

一個(gè)分頁工具條插件：Smart Paginator，這個(gè)插件用途還是很廣的，而且可定制性相當(dāng)不錯(cuò)，目前內(nèi)置三種顏色，有需要的話，可以自己改css定制顏色

1.如何使用Smart Paginator？

1.1引入以下幾個(gè)文件

<script src="jquery-1.4.4.min.js" type="text/javascript"></script>     <script src="smartpaginator.js" type="text/javascript"></script>     <link href="smartpaginator.css" rel="stylesheet" type="text/css" />

1.2添加一個(gè)分頁容器層

<div id="smart-paginator" > </div>

1.3初始化插件

$(document).ready(function() { $('#smart-paginator').smartpaginator({                                  totalrecords: total,                                  recordsperpage: items_per_page,                                  next: '下一頁',                                  prev: '上一頁',                                  first: '首頁',                                  last: '末頁',                                  go: '前往',                                 theme: 'docloud-pagi',                                  initval: current_page,                                 onchange: onPageChange                             }); });   function onPageChange(newPageValue) {             current_page = newPageValue;             //根據(jù)新的頁碼做一些改變，比如說頁面更新操作             getImageList(newPageValue);         }

可以看到想要初始化Smart Paginator，需要配置不少參數(shù)，接下來來看下這些主要參數(shù)的含義。

2.參數(shù)說明

參數(shù)	默認(rèn)值	類型	描述
totalrecords	0	Number	總的分頁數(shù)
recordsperpage	0	Number	單頁數(shù)據(jù)量
length	10	Number	這個(gè)參數(shù)很特殊，上一頁、下一頁、第一頁、最后一頁的顯示控制依賴于這個(gè)參數(shù)，當(dāng)length的值大于totalrecords/recordsperpage時(shí)，是不顯示上一頁、下一頁、第一頁、最后一頁的
next	Next	String	下一頁文本
prev	Prev	String	上一頁文本
first	First	String	第一頁文本
last	Last	String	最后一頁文本
go	Go	String	跳轉(zhuǎn)文本
theme	green	Stirng	模板
display	double	String
initval	1	Number	默認(rèn)顯示第幾頁
datacontainer	”	String	數(shù)據(jù)容器id，請看demo3
dataelement	”	String	數(shù)據(jù)元素，指的是容器下的對應(yīng)的子元素的選擇器，請看demo2
onchange	null	Function	分頁改變后觸發(fā)的函數(shù)

3.自定義顏色模板

.docloud-pagi  {      background-color: #F0F5FF;  } .docloud-pagi.normal  {      background-color: #588500;      color: White;      border: solid 1px #5f9000;  }  .docloud-pagi.active  {      background-color: #344C00;      color: #F8EB00;      border: solid 1px #5f9000;  }  .docloud-pagi .btn  {      background-color: #588500;      color: White;      border: solid 1px #5f9000;  }

以上是“jquery中分頁插件smartpaginator怎么用”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

新聞名稱：jquery中分頁插件smartpaginator怎么用
鏈接地址：http://muchs.cn/article4/gppcie.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站維護(hù)、域名注冊、外貿(mào)網(wǎng)站建設(shè)、響應(yīng)式網(wǎng)站、移動網(wǎng)站建設(shè)、ChatGPT

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)