jBootstrapPage修改可以返回第一页<<和>>最后一页问题

来源：互联网发布：软件测试是什么意思编辑：程序博客网时间：2024/04/17 02:05

问题：jBootstrapPage默认<<和>>返回的是上一页和下一页，需要要求返回第一页和最后一页

修改jBootstrapPage.js

1.添加c.maxPages<=1只有页面小于等1时默认下一页和>>默认是禁用状态if(c.maxPageButton > c.maxPages && c.maxPages<=1) {

function init() {

$this.find('li').remove();

c.maxPages = Math.ceil(c.total/c.pageSize);

if(c.maxPages < 1)return;

$this.append('<li class="disabled"><a class="first" href="#">«</a></li>');

$this.append('<li class="disabled"><a class="pre" href="#">上一页</a></li>');

var pageCount = c.maxPages < c.maxPageButton ? c.maxPages : c.maxPageButton;

var pNum = 0;

for(var index = 1; index <= pageCount; index++) {

pNum++;

$this.append('<li class="page" pNum="'+pNum+'"><a href="#" page="'+index+'">'+index+'</a></li>');

}

$this.append('<li class="disabled"><a class="next" href="#">下一页</a></li>');

$this.append('<li><a class="last" href="#">»</a></li>');

if(c.maxPageButton > c.maxPages && c.maxPages<=1) {

$this.find('li a.next').parent().addClass("disabled");

$this.find('li a.last').parent().addClass("disabled");

}else {

$this.find('li a.next').parent().removeClass("disabled");

$this.find('li a.last').parent().removeClass("disabled");

}

$this.find('li:nth-child(3)').addClass('active');

firstBtn = $this.find('li a.first').parent();

preBtn = $this.find('li a.pre').parent();

lastBtn = $this.find('li a.last').parent();

nextBtn = $this.find('li a.next').parent();

}

2.拆分出<<和>>部分判断查看红色修改即可

function onPageBtnClick($_this) {

var selectedText = $_this.text();

var selectedBtn = $this.find('li.active').find('a');

if(selectedText =='下一页') {

var selectedIndex = parseInt(selectedBtn.text());

var selectNum = parseInt($this.find('li.active').attr('pNum'))+1;

if(selectNum > c.maxPageButton) selectNum = c.maxPageButton-1;

if(selectedIndex > 0) {

mathNextPage(selectNum, selectedIndex, c.maxPages, c.maxPageButton);

selectedBtn = $this.find('li.page').find('a[page="'+(selectedIndex+1)+'"]');

}

}else if(selectedText == '»'){

var selectedIndex = c.maxPages;// parseInt(selectedBtn.text());

var selectNum = parseInt($this.find('li.active').attr('pNum'))+(c.maxPages-parseInt(selectedBtn.text()));//+1;

if(selectNum > c.maxPageButton) selectNum = c.maxPageButton-1;

if(selectedIndex > 0) {

mathNextPage(selectNum, selectedIndex, c.maxPages, c.maxPageButton);

selectedBtn = $this.find('li.page').find('a[page="'+selectedIndex+'"]'); //(selectedIndex+1)

}

elseif(selectedText == '上一页') { // || selectedText == '«'

var selectedIndex = parseInt(selectedBtn.text())-1;

var selectNum = parseInt($this.find('li.active').attr('pNum'))-1;

if(selectNum < 1) selectNum = 1;

mathPrePage(selectNum, selectedIndex, c.maxPages, c.maxPageButton);

selectedBtn = $this.find('li.page').find('a[page="'+(selectedIndex)+'"]');

}

else if(selectedText == '«'){

var selectedIndex = 1;//parseInt(selectedBtn.text())-1;

var selectNum = parseInt($this.find('li.active').attr('pNum'))-(parseInt(selectedBtn.text())-1);//1;

if(selectNum < 1) selectNum = 1;

mathPrePage(selectNum, selectedIndex, c.maxPages, c.maxPageButton);

selectedBtn = $this.find('li.page').find('a[page="'+(selectedIndex)+'"]');

}

else {

selectedBtn = $_this;

}

onClickPage(selectedBtn);

}

3.上一页方法修改查看红色修改即可

function mathPrePage(currButtonNum, currPage, maxPage, showPage) {

if(maxPage < 1)return;

//选中的按钮大于中间数，就进一位

var middle = Math.ceil(showPage/2);// 4

// 4 > 3

// 5 - 4 + 3

//添加等于第一页时进入执行

if((currPage == 1 ||currButtonNum != currPage) && currButtonNum < middle) { //currPage == 1 ||

$this.find('li.page').remove();

//1 2 3 4 5 6 7 8 9 10

var endPages = currPage + Math.floor(middle/2);

if(endPages < c.maxPageButton) endPages = c.maxPageButton+1;

//如何结束页大于最大显示页数则设置设置最大显示

if(c.maxPageButton > maxPage) endPages = maxPage;

var startPages = endPages - c.maxPageButton;

if(startPages <= 0)startPages = 1;

if(endPages - startPages >= c.maxPageButton) {

var d = endPages - startPages - c.maxPageButton;

if(d == 0) d = 1;

endPages -= d;

}

var pNum = 0;

var html ='';

for(var index = startPages; index <= endPages; index++) {

pNum++;

html +='<li class="page" pNum="'+pNum+'"><a href="#" page="'+index+'">'+index+'</a></li>';

}

$this.find('li:nth-child(2)').after(html);

bindPages();

}

3.下一页方法修改查看红色修改即可

function mathNextPage(currButtonNum, currPage, maxPage, showPage) {

if(maxPage < 1)return;

var offsetRight = 2;

//选中的按钮大于中间数，就进一位

var middle = showPage - 1;// 4

// 4 > 3

// 5 - 4 + 3

if((currButtonNum != currPage+1 || maxPage > showPage) && currButtonNum >= middle) {

//显示后面2个按钮

var startPages = currPage - offsetRight;

var endPages = currPage + middle;

endPages = endPages >= maxPage ? maxPage : endPages;

if(endPages <= c.maxPageButton) endPages = c.maxPageButton;

//结束页大于可显示的最大页则修改结束页等于可显示的最大页

if(c.maxPageButton > maxPage) endPages = maxPage;

if(endPages - startPages >= c.maxPageButton) {

var d = endPages - startPages - c.maxPageButton;

endPages -= d;

}

if(endPages == maxPage)endPages++;

if(endPages - startPages < c.maxPageButton) {

var d = c.maxPageButton - (endPages - startPages);

startPages -= d;

}

//小于等于默认显示1

if(startPages <= 0)startPages = 1;

var pNum = 0;

var html ='';

for(var index = startPages; index < endPages; index++) {

pNum++;

html +='<li class="page" pNum="'+pNum+'"><a href="#" page="'+index+'">'+index+'</a></li>';

}

$this.find('li.page').remove();

$this.find('li:nth-child(2)').after(html);

bindPages();

}

阅读全文

0 0