<script>      

 //分页

        function getPageNum(num) {

            $("#PageNum ul").empty();

            var AllCount = num;

            var total = Math.ceil(AllCount / 5); //数据可分的页数

            var allhtml = "共<strong style='margin: auto 3px;'>" + total + "</strong>页";

            $("#txtAll").html(allhtml);

//            $("#txtAll").val(total);

            for (var i = 1; i < total + 1; i++) {

                var html = "<li><a>" + i + "</a></li>";

                $("#PageNum ul").append(html);

            }

            var totalCount = Math.ceil(total / 7);

            var current = 1;

            $("#PageNum ul li:gt(6)").hide();

            $("#btnPrev").attr("disabled", "disabled").click(function () {

                $("#btnNext").removeAttr("disabled");

                current -= 1;

                $("#PageNum ul li").hide();

                var indexStart = (current - 1) * 7;

                var indexEnd = indexStart + 7;

                $(" #PageNum ul li").hide().slice(indexStart, indexEnd).show();

                if (current == 1) $(this).attr("disabled", "disabled");

            });

            $("#btnNext").click(function () {

                $("#btnPrev").removeAttr("disabled");

                current += 1;

                $("#PageNum ul li").hide();

                var indexStart = (current - 1) * 7;

                var indexEnd = current * 7 - 1 > $("#PageNum ul li").length - 1 ? $("#PageNum ul li").length - 1 : current * 7 - 1;

                $(" #PageNum ul li").hide().slice(indexStart, indexEnd+1).show();

                if (current == total) $(this).attr("disabled", "disabled");

            });

            $("#PageNum ul li").click(function () { //点击数字

                $("#PageNum ul li").removeClass();

                $(this).addClass("current");

                var index = $(this).index();

                getPageCurrent(index);

            })

            $("#btnConfirm").click(function () {//搜索页

                $("#PageNum ul li").removeClass();

                var index = $("#txtIndex").val();

                if (index % 7 == 0) {

                    var indexStart = (Math.ceil(index / 7) - 1) * 7;

                }

                else {

                    indexStart = index - (index % 7);

                }

                var indexEnd = indexStart + 7;

                $(" #PageNum ul li").hide().slice(indexStart, indexEnd).show();

                $(" #PageNum ul li").eq(index - 1).addClass("current");

                getPageCurrent(index - 1);

            })

        }

        function getPageCurrent(index) {

            var indexStart = index * 5;

            var indexEnd = indexStart + 5;

            $(" #thumbWrap_controlID ul li").hide().slice(indexStart, indexEnd).show();

        }

</script>

html代码：

<div class="products_contents" id="product">

                <div class="thumbWrap">

                    <h2 style="font-size: 30px; color: #f8b551; text-align: center; line-height: 56px;">

                    </h2>

                    <div class="thumbWrap_control" id="thumbWrap_controlID">

                        <ul style=" height:24px;">

                        </ul>

                    </div>

                    <div id="PageNum">

                     <span class="totalPage" id="txtAll"></span>

                    <input type="button" id="btnPrev" value="上一页" />

                        <ul>

                        </ul>

                        <input type="button" id="btnNext" value="下一页" />

                        到<input type="text" id="txtIndex"/>页<input type="button" id="btnConfirm" value="确定" />

                    </div>

                </div>

            </div>
样式：

<style type="text/css">

 #PageNum{ width:680px; margin-top:20px; font-size:16px; color:#84868e; float:left; margin-left:25px;}

        #PageNum ul{list-style:none;text-align:center;}

        #PageNum ul li{ font-size:12px; margin-left:6px; margin-right:6px; float:left; border:1px solid #ccc; padding-left:8px; padding-right:8px; line-height:24px; font-size:16px; cursor:pointer;}

        .current{background:#fff; color:#020e2a;}

        #btnPrev,#btnNext,#txtAll{ float:left; margin:0px; margin-left:5px; margin-right:5px;}

        #btnPrev,#btnNext,#btnConfirm{ color:#555;line-height:24px; height:24px; padding-left:5px; padding-right:5px;}

        #txtAll{ width:56px; height:24px; line-height:24px;color:#616D89;}

        #txtIndex{ width:50px;height:24px; line-height:24px; margin:0px; background: #0c2643;}

        .totalPage{ float:left; display:block; line-height:24px; margin-right:40px;}

     </style>