js的几种分页 - 走看看

zoukankan html css js c++ java

js的几种分页

1.
function lastStart(pageIndex,size){
                    for(i=pageIndex-1;i>=0;i--){
                        if(i%size==0){
                            return i+1;
                        }
                    }
                }
                function firstEnd(pageIndex,totalPage,size){
                    for(i=pageIndex;i<totalPage;i++){
                        if(i%size==0){
                            return i;
                        }
                    }
                    return totalPage;
                }
                function drawPage(total, pageIndex, pageSize) {
                    if (!total || total == "" || total == 0) {
                        total = 1;
                    }
                    var totalPage = parseInt(((total - 1) / pageSize) + 1);

                    var pageHtml = ['<a href="javascript:;" onclick="funSearch(1)">首页</a>'];
                    if (pageIndex == 1) {
                        pageHtml.push('<a href="javascript:;" class="page_turn_btn over_page"><</a>');
                    } else {
                        pageHtml.push('<a href="javascript:;" class="page_turn_btn" onclick="funSearch(');
                        pageHtml.push(pageIndex - 1);
                        pageHtml.push(')"><</a>');
                    }
                    if (totalPage < 6) {
                        for (var i = 1; i <= totalPage; i++) {
                            if (pageIndex == i) {
                                pageHtml
                                        .push('<a href="javascript:;" class="chan_page_check" onclick="funSearch(');
                                pageHtml.push(i);
                                pageHtml.push(')">');
                                pageHtml.push(i);
                                pageHtml.push('</a>')
                            } else {
                                pageHtml.push('<a href="javascript:;" onclick="funSearch(');
                                pageHtml.push(i);
                                pageHtml.push(')">');
                                pageHtml.push(i);
                                pageHtml.push('</a>')
                            }
                        }
                    } else {
                        var start = lastStart(pageIndex,5);
                        var end = firstEnd(pageIndex,totalPage,5);
                        if(start>1){
                            pageHtml.push('<a href="javascript:;" onclick="funSearch('+(start-1)+')">…</a>');
                        }
                        for (var i = start; i <=end; i++) {
                            if (pageIndex == i) {
                                pageHtml
                                        .push('<a href="javascript:;" class="chan_page_check" onclick="funSearch(');
                                pageHtml.push(i);
                                pageHtml.push(')">');
                                pageHtml.push(i);
                                pageHtml.push('</a>');
                            } else {
                                pageHtml.push('<a href="javascript:;" onclick="funSearch(');
                                pageHtml.push(i);
                                pageHtml.push(')">');
                                pageHtml.push(i);
                                pageHtml.push('</a>');
                            }
                        }
                        if(end<totalPage){
                            pageHtml.push('<a href="javascript:;" onclick="funSearch('+(end+1)+')">…</a>');
                        }
                    }
                    if (pageIndex < totalPage) {
                        pageHtml
                                .push('<a href="javascript:;" class="page_turn_btn" onclick="funSearch(');
                        pageHtml.push(Number(pageIndex) + 1);
                        pageHtml.push(')">></a>');
                    } else {
                        pageHtml
                                .push('<a href="javascript:;" class="page_turn_btn over_page">></a>');
                    }
                    pageHtml.push('<a href="javascript:;" onclick="funSearch(');
                    pageHtml.push(totalPage);
                    pageHtml.push(')">尾页</a>');

                    pageHtml
                            .push('<div class="chant_page_num"><span>第</span><input type="text" class="input_page_num" id="toPage" /><span>页</span></div><a href="javascript:;" class="right chan_btn wid60 margr65" id="goPage">确定</a>');
                    $("div.chan_table_page").html(pageHtml.join(''));
                    $("#goPage").click(function() {
                        var toPageIndex = $("#toPage").val();
                        if (!toPageIndex || !/^d+$/.test(toPageIndex)
                                || toPageIndex > totalPage) {
                            showAlert("您输入的页码不在范围内");
                        } else {
                            funSearch(toPageIndex);
                        }
                    });
                }

2.
function drawPage(total, pageIndex, pageSize) {
    if (!total || total == "" || total == 0) {
        total = 1;
    }
    var totalPage = parseInt(((total - 1) / pageSize) + 1);
    var length = totalPage - pageIndex;
    // var temp = pageIndex;
    var pageHtml = ['<a href="javascript:;" onclick="funSearch(1)">首页</a>'];
    if (pageIndex == 1) {
        pageHtml
                .push('<a href="javascript:;" class="page_turn_btn over_page"><</a>');
    } else {
        pageHtml
                .push('<a href="javascript:;" class="page_turn_btn" onclick="funSearch(');
        pageHtml.push(pageIndex - 1);
        pageHtml.push(')"><</a>');
    }
    if (totalPage <= 6) {
        for (var i = 1; i <= totalPage; i++) {
            if (pageIndex == i) {
                pageHtml
                        .push('<a href="javascript:;" class="chan_page_check" onclick="funSearch(');
                pageHtml.push(i);
                pageHtml.push(')">');
                pageHtml.push(i);
                pageHtml.push('</a>')
            } else {
                pageHtml.push('<a href="javascript:;" onclick="funSearch(');
                pageHtml.push(i);
                pageHtml.push(')">');
                pageHtml.push(i);
                pageHtml.push('</a>')
            }
        }
    } else {
        var temp = pageIndex > 2 ? pageIndex - 2 : 1;
        var plen = null;
        if (pageIndex < 3) {
            plen = 3;
        } else if (pageIndex == totalPage) {
            plen = pageIndex;
        } else {
            plen = pageIndex + 1;
        }
        for (var i = temp; i <= plen; i++) {
            if (pageIndex == i) {
                pageHtml
                        .push('<a href="javascript:;" class="chan_page_check" onclick="funSearch(');
                pageHtml.push(i);
                pageHtml.push(')">');
                pageHtml.push(i);
                pageHtml.push('</a>');
            } else {
                pageHtml.push('<a href="javascript:;" onclick="funSearch(');
                pageHtml.push(i);
                pageHtml.push(')">');
                pageHtml.push(i);
                pageHtml.push('</a>');
            }
        }
        if (pageIndex + 1 < totalPage) {
            pageHtml.push("<span class='left'>……</span>");
        }
        var star = totalPage - 1;
        if (star <= pageIndex + 1) {
            star = pageIndex + 2;
        }
        for (var i = star; i <= totalPage; i++) {
            pageHtml.push('<a href="javascript:;" onclick="funSearch(');
            pageHtml.push(i);
            pageHtml.push(')">');
            pageHtml.push(i);
            pageHtml.push('</a>');
        }
    }
    if (pageIndex < totalPage) {
        pageHtml
                .push('<a href="javascript:;" class="page_turn_btn" onclick="funSearch(');
        pageHtml.push(Number(pageIndex) + 1);
        pageHtml.push(')">></a>');
    } else {
        pageHtml
                .push('<a href="javascript:;" class="page_turn_btn over_page">></a>');
    }
    pageHtml.push('<a href="javascript:;" onclick="funSearch(');
    pageHtml.push(totalPage);
    pageHtml.push(')">尾页</a>');
    pageHtml
            .push('<div class="chant_page_num"><span>第</span><input type="text" class="input_page_num" id="toPage" /><span>页</span></div><a href="javascript:;" class="right chan_btn wid60 margr65" id="goPage">确定</a>');
    $("div.chan_table_page").html(pageHtml.join(''));
    $("#goPage").click(function() {
        var toPageIndex = $("#toPage").val();
        if (!toPageIndex || !/^d+$/.test(toPageIndex)
                || toPageIndex > totalPage) {
            alert("您输入的页码不在范围内");
        } else {
            funSearch(toPageIndex);
        }
    });
}
3.
function drawPage(total, pageIndex, pageSize) {
if (!total || total == "" || total == 0) {
total = 1;
}
var totalPage = parseInt(((total - 1) / pageSize) + 1);

var pageHtml = ['<a href="javascript:;" onclick="funSearch(1)">首页</a>'];
if (pageIndex == 1) {
pageHtml.push('<a href="javascript:;" class="page_turn_btn over_page"><</a>');
} else {
pageHtml.push('<a href="javascript:;" class="page_turn_btn" onclick="funSearch(');
pageHtml.push(pageIndex - 1);
pageHtml.push(')"><</a>');
}

var startnum=pageIndex-3;
var endnum=pageIndex+2;
if(startnum<1){
startnum=1;
endnum=6;
}
if(endnum>totalPage){
endnum=totalPage;
startnum=totalPage-5;
}
if(totalPage<=6){
startnum=1;
endnum=totalPage;
}
if(pageIndex>4&&totalPage>6){
pageHtml.push("<span class='left'>…</span>");
}
for (var i =startnum; i <= endnum; i++) {
if (pageIndex == i) {
pageHtml
.push('<a href="javascript:;" class="chan_page_check" onclick="funSearch(');
pageHtml.push(i);
pageHtml.push(')">');
pageHtml.push(i);
pageHtml.push('</a>')
} else {
pageHtml.push('<a href="javascript:;" onclick="funSearch(');
pageHtml.push(i);
pageHtml.push(')">');
pageHtml.push(i);
pageHtml.push('</a>')
}
}

if(pageIndex<totalPage-2&&totalPage>6){
pageHtml.push("<span class='left'>…</span>");
}

if (pageIndex < totalPage) {
pageHtml
.push('<a href="javascript:;" class="page_turn_btn" onclick="funSearch(');
pageHtml.push(Number(pageIndex) + 1);
pageHtml.push(')">></a>');
} else {
pageHtml
.push('<a href="javascript:;" class="page_turn_btn over_page">></a>');
}
pageHtml.push('<a href="javascript:;" onclick="funSearch(');
pageHtml.push(totalPage);
pageHtml.push(')">尾页</a>');

pageHtml
.push('<div class="chant_page_num"><span>第</span><input type="text" class="input_page_num" id="toPage" /><span>页</span></div><a href="javascript:;" class="right chan_btn wid60 margr65" id="goPage">确定</a>');
$("div.chan_table_page").html(pageHtml.join(''));

$("#goPage").click(function() {
var toPageIndex = $("#toPage").val();
if (!toPageIndex || !/^d+$/.test(toPageIndex)
|| toPageIndex > totalPage) {
showAlert("您输入的页码不在范围内");
} else {
funSearch(toPageIndex);
}
});
}

来自为知笔记(Wiz)

查看全文

相关阅读:
剑指offer---二叉搜索树的第k个结点
 剑指offer---把数组排成最小的数
 剑指offer---连续子数组的最大和
 剑指offer---最小的K个数
 Navicat for MySQL（Ubuntu）过期解决方法
 Ubuntu 无法应用原保存的显示器配置
 ubuntu 18.04 install gitlab-ce
Flask 使用过程
 python版本 3.7.4rc1 (stable) / 3.8.0b1 (pre-release) / 3.9.0a0 (in development)
Windows10 and MySQL使用

原文地址：https://www.cnblogs.com/headwolf/p/333eb29d3a5f50683ca59e5a709d26bb.html