Jquery 動态插入分頁資料

//1.插入的分頁 函數封裝  擷取總的頁面數   還有目前的選中的頁碼
    // insertHtml(6,1);//6,1假設資料
    //一、動态插入資料-------------------------------
    function insertHtml(page,current){//1
        var pagination=$(".ts-page").html('');
        //1.顯示首頁 上一頁 選中頁面 大于1 說明可以點選上一頁 首頁
        // 首頁  上一頁
        if(current>1){
            pagination.append('<span class="tspage-start">首頁</span>');
            pagination.append('<span class="tspage-before">上一頁</span>');
        }else{//current=1 上一頁 不可點選
            pagination.remove('.tspage-start');
            pagination.append('<span class="tspage-before disable">上一頁</span>');
        }

        //2.顯示 ...     首頁  上一頁 ...   -> 2 3 [4] 5 6   
        if(current > 3 && current <= page ){
            pagination.append('<span class="tspage-ell">...</span>');
        }

        //3.開始添加頁碼   首頁  上一頁 ...  2 3 【4】 5 6 ...   --->分析：  1 2 【3】 4 5 
        //current 選中的  擷取頁碼  current-2  current-1 current  current+1  current+2
        var start=current-2;
        var end=current+2;
        //分析--->    1 【2】 3 4 -->   1 【2】 3 4 5
        if(current==2 || current==1){
            start=1;
            end= page>5 ? 5:page;
        }else if( current == page){// ... 2 3 4 5 6    ... 2 3 [4] 5 6  ... 2 3 4 [5] 6  ... 2 3 4 5 [6] 
            start=current-4;
            end=current;
        }
        else if( current == page-1){
            start=current-3;
            end=current+1;
        }
        //循環顯示資料
        for(;start<=end;start++){
            if(start >=1 && end<=page){
                if(start==current){
                    pagination.append('<span class="page on">'+start+'</span>');
                }else{
                    pagination.append('<span class="page">'+start+'</span>');
                }            
            }
        }
        //4.添加 後面的 ...  當分頁資料 page>5大于5顯示不完 顯示...
        if(page > 5 && current < page-2){
            pagination.append('<span class="tspage-ell">...</span>');
        }
        //5.最後的  下一頁  尾頁
        if(current<page){
            pagination.append(' <span class="tspage-after">下一頁</span>');
            pagination.append(' <span class="tspage-end">尾頁</span>');
        }else{
            pagination.remove('.tspage-end');
            pagination.append(' <span class="tspage-after disable">下一頁</span>');

        }
    }
           

 HTML代碼：

<!-- 分頁工具 -->
<div class="ts-page">
    <!-- <span class="tspage-start">首頁</span>
    <span class="tspage-before">上一頁</span>
    <span class="page">1</span>
    <span class="page on">2</span>
    <span class="page">3</span>
    <span class="page">4</span>
    <span class="page">5</span>
    <span class="tspage-ell">...</span>
    <span class="tspage-after">下一頁</span>
    <span class="tspage-end">尾頁</span> -->
</div>
           

 效果圖：