jQuery json表格數(shù)據(jù)自動(dòng)分頁插件

jQuery基于強(qiáng)大的layui 框架,通過擴(kuò)展nicePage.js實(shí)現(xiàn)JSON數(shù)據(jù)格式的自動(dòng)表格分頁和跳轉(zhuǎn)功能,配置簡單,上手速度快，兼容IE5+

基本使用說明：

//標(biāo)準(zhǔn)json格式 目前只支持[{a:b,c:d},{a:b,c:d}]

var json=[{"id":"1","name":"Tom","age":"12"},{"id":"2","name":"Joy","age":"13"}]

//nameList與widthList的數(shù)組長度要一致
nameList//數(shù)組為表格列名,如['序號(hào)','姓名','年齡']
widthList//數(shù)組為列名的寬度,如['100','200','100']

/**
 * 初始化設(shè)置nicepage組件
 *------------------------------------------------------------
 * 進(jìn)行數(shù)據(jù)組裝,與layui交互進(jìn)行元素渲染
 *-------------------------------------------------------------
 * @param    {string}  table     table的div id
 * @param    {string}  bar     底部分頁的div id
 * @param    {int}  limit     每頁默認(rèn)行數(shù)
 * @param    {string}  color     底部分頁的顏色
 * @param    {array}  layout     底部分頁的布局,具體可參考layui api
 *
 * @date     2018-10-19
 */
//初始化
$(function () {
	nicePage.setCfg({
		table: 'table',
		bar: 'pageBar',
		limit: 20,
		color: '#1E9FFF',
		layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']
	});
});
//初始化完成

使用聲明

1. 本站所有素材（未指定商用），僅限學(xué)習(xí)交流。
2. 會(huì)員在本站下載的原創(chuàng)商用和VIP素材后，只擁有使用權(quán)，著作權(quán)歸原作者及17素材網(wǎng)所有。
3. 原創(chuàng)商用和VIP素材，未經(jīng)合法授權(quán)，請(qǐng)勿用于商業(yè)用途，會(huì)員不得以任何形式發(fā)布、傳播、復(fù)制、轉(zhuǎn)售該素材，否則一律封號(hào)處理。
4. 本平臺(tái)織夢(mèng)模板僅展示和個(gè)人非盈利用途，織夢(mèng)系統(tǒng)商業(yè)用途請(qǐng)預(yù)先授權(quán)。

查看演示下載資源

1443 16505 72