JavaScript分页

当前页码前后显示 3 页，然后需要显示第一页和最后一页,未显示的页码用省略号表示。

当前页码为 1，那么显示 1 2 3 4 ... 110 下一页

当前页码为 2，那么显示 上一页 1 2 3 4 5 ... 110 下一页

当前页码为 3，那么显示 上一页 1 2 3 4 5 6 ... 110 下一页

当前页码为 4，那么显示 上一页 1 2 3 4 5 6 7 ... 110 下一页

当前页码为 5，那么显示 上一页 1 2 3 4 5 6 7 8 ... 110 下一页

当前页码为 6，那么显示 上一页 1 ... 3 4 5 6 7 8 9 ... 110 下一页

…

当前页码为 100，那么显示 上一页 1 ... 97 98 99 100 101 102 103 ... 110 下一页

…

当前页码为 109，那么显示 上一页 1 ... 106 107 108 109 110 下一页

当前页码为 110，那么显示 上一页 1 ... 107 108 109 110

 

function showPages (page, total) {

        var str = page + '';
 
        for (var i = 1; i <= 3; i++) {
            if (page - i > 1) {
                str = page - i + ' ' + str;
            }
            if (page + i < total) {
                str = str + ' ' + (page + i);
            }
        }
 
        if (page - 4 > 1) {
            str = '... ' + str;
        }
 
        if (page > 1) {
            str = '上一页 ' + 1 + ' ' + str;
        }
 
        if (page + 4 < total) {
            str = str + ' ...';
        }
 
        if (page < total) {
            str = str + ' ' + total + ' 下一页';
        }
 
        return str;
    }

　　

function showPageCommon(config) {  
    return function (page, total) {
        var str = '<a>' + page + '</a>';
 
        for (var i = 1; i <= 3; i++) {
            if (page - i > 1) {
                str = '<a class="' + config.color + '">' + (page - i) + '</a> ' + str;
            }
            if (page + i < total) {
                str = str + ' ' + (page + i);
            }
        }
 
        if (page - 4 > 1) {
            str = '... ' + str;
        }
 
        if (page > 1) {
            str = '上一页 ' + 1 + ' ' + str;
        }
 
        if (page + 4 < total) {
            str = str + ' ...';
        }
 
        if (page < total) {
            str = str + ' ' + total + ' 下一页';
        }
 
        return str;
    }
}
 
var showPages = showPageCommon({  
    color: 'red'
});
 
var total = 110;  
for (var i = 1; i <= total; i++) {  
    var ret = showPages(i, total);
    console.log(ret);
}
 
var showPages = showPageCommon({  
    color: 'blue'
});
 
var total = 110;  
for (var i = 1; i <= total; i++) {  
    var ret = showPages(i, total);
    console.log(ret);
}