分页不起作用:

时间:2013-08-24 09:35:12

标签: javascript jquery html pagination

我正在使用以下javascript在我的应用程序中显示分页,它对我来说很好,但我需要在5页后打破分页

这是我现有的分页

1 2 3 4 5 6 7 8 9 {{ 1}} 10 11 12 13 14 15 16 17 18 {{ 1}}

但我需要按照

显示分页

19 20 1 2 3 ...... 4 5 15 { {1}} 16 17

如果我点击第5页,那么它应该再添加5页到当前页面

我喜欢这样的Javscript

18

如果有任何建议可以理解

这是JSfiddle

1 个答案:

答案 0 :(得分:2)

这是一个新的jsfiddle做你想做的事情:

http://jsfiddle.net/nye7a/2/

showPageNav函数已经改变如下:

this.showPageNav = function(pagerName, positionId) {

var pageIndex = this.currentPage,
    pageCount = this.pages,
    start = Math.max(1, pageIndex - 4),
    end = Math.min(pageCount, pageIndex + 4),
    start2 = pageCount-4,
    end2 = pageCount;

    if (start2 <= end)
        end = pageCount;

if (! this.inited) {

alert("not inited");

return;

}

var element = document.getElementById(positionId);

var pagerHtml = '';

// adds the Prev button only if needed
if (pageIndex > 1)
    pagerHtml = '<span onclick="' + pagerName + '.prev();" class="pg-normal"> « Prev </span> ';

    // paging from 1 to 5   
    for (var page = start; page <= end; page++) {

pagerHtml += '<span id="pg' + page + '" class="pg-normal" onclick="' + pagerName + '.showPage(' + page + ');">' + page + '</span> ';
    }

    // paging from pageCount-5 to pageCount
    if (end != pageCount) {
         pagerHtml += '<span>...</span>';

        for (var page = start2; page <= end2; page++) {

    pagerHtml += '<span id="pg' + page + '" class="pg-normal" onclick="' + pagerName + '.showPage(' + page + ');">' + page + '</span> ';
        }   
    }

// adds the Next button only if needed
if (pageIndex < pageCount && pageCount > 1)    
    pagerHtml += '<span onclick="'+pagerName+'.next();" class="pg-normal"> Next »</span>';

element.innerHTML = pagerHtml;

}