分頁控制項代碼邏輯（JS版本&PHP版本）

JS版本：

    //total_page:總頁數    //boundary：頁數臨界值    //front_range:前段顯示頁碼數    //mid_range:中段顯示頁碼數    //rear_range後段顯示頁碼數    //page_size：每頁記錄數    var pagination_config = {total_page : 10,current_page:1, boundary : 7, front_range : 1, mid_range : 5,rear_range : 1,page_size:10};    /**     * 分?格式?理，ex. prev 1 ... 8 9 10 11 12 ... 20 next     * @return array 要?示的??     */    function pagintion_array()    {                var total_page = pagination_config.total_page,                    boundary = pagination_config.boundary,                     front_range =  pagination_config.front_range,                     mid_range = pagination_config.mid_range,                    rear_range = pagination_config.rear_range,                    current_page = pagination_config.current_page;        var pagintion = [];        current_page = (current_page > total_page) ? total_page : current_page;        // ???小於???界值，??示所有??        if (total_page <= boundary) {            for (i = 1; i <= total_page; i++) {                pagintion.push(i);            }        } else {            var front_end     = front_range; // 前段最後一???            var mid_start     = current_page - Math.ceil(parseFloat(mid_range - 1) / 2); // 中段第一???            var mid_end     = current_page + ((mid_range - 1) - Math.ceil((mid_range - 1) / 2)); // 中段最後一???            var rear_start     = total_page - rear_range + 1; // 後段第一???            // 中段第一???小於等於1，中???往左位移            while (mid_start <= 1) {                if (mid_start < 1)                    mid_end += 1;                mid_start += 1;            }            // 中段第一???大於等於???，中???往右位移            while (mid_end >= total_page) {                if (mid_end > total_page)                    mid_start -= 1;                mid_end -= 1;            }            // 取出需要?示的???            for (var i = 1; i <= total_page; i++) {                if (i <= front_end || (i >= mid_start && i <= mid_end) || i >= rear_start) {                    if (i - pagintion[pagintion.length-1] > 1) {                        pagintion.push('...');                    }                    pagintion.push(i);                }            }        }        return pagintion;    }    /**     * 拼裝分頁的 html  ;     * 樣式 for jquery.simplepagination      * @return string     */    function create_html()    {                var current_page = pagination_config.current_page,                    total_page = pagination_config.total_page;                if(total_page<=1){                    return;                }        var html = '
 

  ';        //計算總頁數;        //計算分頁        var pagintion = pagintion_array();        //上一頁        //上一頁 不可點擊        if (current_page <= 1) {            html+='
  
上一頁
';        } else {            //上一頁可點擊            var page_prev = current_page - 1;            html+='
  
上一頁
';        }        //每一頁的 連結                for(var i=0;i'+page_id+'';                    } else if (page_id == '...') {                            html+='
  
...
';                    } else {                            html+='
  
'+page_id+'
';                    }                }        //下一頁        //下一頁 不可點擊        if (current_page >= total_page) {            html+='
  
下一頁
';        } else {            //下一頁 可點擊            var page_next = current_page + 1;            html+='
  
下一頁
';        }                html+='
  
到第
';                html+='
  
';                html+='
  
頁
';                html+='
  
確定
';        html+='
 
';                $('.pagintion').children().remove();        $('.pagintion').append(html);                $(".pagintion").find('[data-page-index]').on("click",function(){                    if($(this).data('page-index')!=pagination_config.current_page){                        pagination_config.current_page = $(this).data('page-index');                        //繫結資料行表                        get_comment_list();                    }                })    }    }

PHP版本：

 0) {            foreach ($config as $key => $val) {                if (isset($this->$key)) {                    $this->$key = $val;                }            }        }    }    /**     * 分?格式?理，ex. prev 1 ... 8 9 10 11 12 ... 20 next     *  copy from Store_lib.pagintion  , 從Store_lib中複製過來     * @param int $current_page ?前??     * @param int $total_page ???     * @param int $boundary ???界值     * @param int $front_range 前段?示???     * @param int $mid_range 中段?示???     * @param int $rear_range 後段?示???     * @return array 要?示的??     */    public function pagintion_array($current_page = 1, $total_page = 10, $boundary = 7, $front_range = 1, $mid_range = 5,                                 $rear_range = 1)    {        $pagintion = array();        $current_page = ($current_page > $total_page) ? $total_page : $current_page;        // ???小於???界值，??示所有??        if ($total_page <= $boundary) {            for ($i = 1; $i <= $total_page; $i++) {                $pagintion[] = $i;            }        } else {            $front_end     = $front_range; // 前段最後一???            $mid_start     = $current_page - ceil(($mid_range - 1) / 2); // 中段第一???            $mid_end     = $current_page + (($mid_range - 1) - ceil(($mid_range - 1) / 2)); // 中段最後一???            $rear_start     = $total_page - $rear_range + 1; // 後段第一???            // 中段第一???小於等於1，中???往左位移            while ($mid_start <= 1) {                if ($mid_start < 1)                    $mid_end += 1;                $mid_start += 1;            }            // 中段第一???大於等於???，中???往右位移            while ($mid_end >= $total_page) {                if ($mid_end > $total_page)                    $mid_start -= 1;                $mid_end -= 1;            }            // 取出需要?示的???            for ($i = 1; $i <= $total_page; $i++) {                if ($i <= $front_end || ($i >= $mid_start && $i <= $mid_end) || $i >= $rear_start) {                    if ($i - (int) end($pagintion) > 1) {                        $pagintion[] = '...';                    }                    $pagintion[] = $i;                }            }        }        return $pagintion;    }    /**     * 拼裝分頁的 html  ;     * 樣式 for jquery.simplepagination      * @return string     */    function create_html()    {        $html = '
 

  ';        //計算總頁數;        //計算分頁        $pagintion = $this->pagintion_array($this->current_page, $this->total_page, $this->boundary, $this->front_range, $this->mid_range, $this->rear_range);        //上一頁        //上一頁 不可點擊        if ($this->current_page <= 1) {            $html.='
  
上一頁
';        } else {            //上一頁可點擊            $page_prev = $this->current_page - 1;            $html.='
  
page_url . $page_prev . '" class="page-link prev" url="' . $this->page_url . $page_prev . '" page="' . $page_prev . '" style="color: rgb(102, 102, 102); position: relative; background: rgb(255, 255, 255);">上一頁
';        }        //每一頁的 連結        foreach ($pagintion as $page_id) {            if ($page_id == $this->current_page) {                $html.='
  
' . $page_id . '
';            } elseif ($page_id == '...') {                $html.='
  
…
';            } else {                $html.='
  
page_url . $page_id . '" class="page-link" page="' . $page_id . '">' . $page_id . '
';            }        }        //下一頁        //下一頁 不可點擊        if ($this->current_page >= $this->total_page) {            $html.='
  
下一頁
';        } else {            //下一頁 可點擊            $page_next = $this->current_page + 1;            $html.='
  
page_url . $page_next . '" class="page-link next" url="' . $this->page_url . $page_next . '" page="' . $page_next . '" style="color: rgb(102, 102, 102); position: relative; width: 57px; background: rgb(255, 255, 255);">下一頁
';        }        $html.='
 
';        return $html;    }}

預覽效果：

