仿淘宝ajax分页控件带例子编辑

默认生成的样式.自己可以调整.:

1

2

3

 
         
        < 
        table 
        id 
        = 
        "commentTab" 
        width 
        "100%;" 
        > 
       
 
        </ 
        table 
        > 
       
 
        div 
        "meneameFy" 
        ></ 
        div 
        > 
       

 
        //分页控件输出以及判断的主要方法 
       
        functionpageInit(s){ 
       
        currsPage=s;//当前页码(注意是传过来的) 
       
        vartotalPage= 
        "${totalPage}" 
        ;//最大页码(从后台传递过来的) 
       
        vargrountCount= 
        9 
        ;//每组显示的个数(可以自定义) 
       
        varcurrsPageYM=currsPage+ 
        4 
        ;//页面显示的页码最大值 
       
        varstrSpan= 
        "" 
        ;//向页面输出值 
       
        if(totalPage<grountCount){//最大页码小于每组的显示个数,直接输出所有页码 
       
        if(currsPage== 
        1 
        ){ 
       
        strSpan= 
        "<spanclass='disabled'><</span>" 
        ; 
       
        }else{ 
       
        "<ahref='javascript:Page(1);'><</a>" 
        ; 
       
        } 
       
        for(varj=totalPage;j> 
        0 
        ;j--){ 
       
        varbb=totalPage-j+ 
        ; 
       
        if(bb==currsPage){ 
       
        strSpan=strSpan+ 
        "<spanclass='current'>" 
        +bb+ 
        "</span>" 
        ; 
       
        }else{ 
       
        "<ahref='javascript:Page(" 
        ");'>" 
        "</a>" 
        ; 
       
        } 
       
        if(bb==totalPage){ 
       
        break; 
       
        } 
       
        } 
       
        if(currsPage==totalPage){ 
       
        "<spanclass='disabled'>></span>" 
        ; 
       
        }else{ 
       
        +totalPage+ 
        ");'>></a>" 
        ; 
       
        } 
       
        }elseif(currsPageYM>=totalPage){//页面显示的页码最大值大于或等于最大页码,及最后一组页码显示,做特殊处理 
       
        ){ 
       
        ; 
       
        currsPageYM=grountCount; 
       
        }else{ 
       
        ; 
       
        } 
       
        for(vark=grountCount;k> 
        ;k--){ 
       
        varbb=totalPage-k+ 
        ; 
       
        if(bb==currsPage){ 
       
        ; 
       
       @H_502_519@ 
        }else{

;

}

 
        if(bb==totalPage){ 
       

 
        break; 
       

}

}

 
        if(currsPage==totalPage){ 
       

;

 
        }else{ 
       

;

}

 
        }else{//页码逻辑正常显示处理 
       

){

;

 
        currsPageYM=grountCount; 
       

 
        }else{ 
       

;

}

 
        for(vari=grountCount;i> 
        ;i--){

 
        varbb=currsPageYM-i+ 
        ;

 
        if(bb==currsPage){ 
       

;

 
        }else{ 
       

;

}

 
        if(bb==totalPage){ 
       

 
        break; 
       

}

}

 
        if(currsPage==totalPage){ 
       

;

 
        }else{ 
       

;

}

}

 
        document.getElementById( 
        "meneameFy" 
        ).innerHTML=strSpan; 
       

}

 
        //ajax分页获取数据方法 
       

 
        functionPage(s){ 
       

 
        jQuery( 
        "#commentTabtr" 
        ).remove(); 
       

 
        jQuery.post( 
        "getAllCommentProduct.action" 
        ,{prodId: 
        "${id}" 
         
        pageInit(s); 
       

 
        
        for(vari= 
        ;i<data.rows.length;i++){ 
        
        
        vaRSS= 
        
        
         
        "<tr><thstyle='width:100px;'>评论昵称:</th><td>" 
        +data.rows[i].nicheng+ 
        "</td></tr>" 
        
        
        + 
        "<trclass='capti'>" 
        
        
        "<th>评论内容:</th><td><divstyle='height:100px;width:800px;border:1pxsolidpink;'>" 
        +data.rows[i].content+ 
        "</div><divstyle='float:right;'>" 
        +data.rows[i].createTime+ 
        "</div></td>" 
        
        
        "</tr>" 
        ; 
        
        
        jQuery(ss).appendTo(commentTab); 
        
        
        } 
        
        
         
        
        
        }, 
        "json" 
        ); 
        
        
        } 
        
       
          
        
       
          
        
        
        //页面初始化加载 
        
        
        jQuery(function(){ 
        
        
        <% 
        
        
        Stringid=request.getParameter( 
        "id" 
        ); 
        
        
        request.setAttribute( 
         
        StringtotalPage=request.getParameter( 
        "totalPage" 
        ); 
       
 
        
         
        StringresultSize=request.getParameter( 
        "resultSize" 
        ); 
       
 
        
         
        StringpageNo=request.getParameter( 
        "pageNo" 
        ); 
       
 
        
         
        %> 
       
 
        
        pageInit( 
        );//页面加载初始化传入当前页码为 
        1 
        
        
        Page( 
        );//获取第一页面的数据 
        
        
        });

//默认样式，不喜欢可以修改

 
        <style> 
       

 
        div#meneameFy{ 
        margin 
        : 
        10px 
        150px 
        ;} 
       

 
        div#meneameFyA{ 
       

 
        BORDER-RIGHT: 
        #ff9600 
        1px 
        solid 
        ;PADDING-RIGHT: 
        7px 
        ;BACKGROUND-POSITION: 
        50% 
        bottom 
        ;BORDER-TOP: 
        ;PADDING-LEFT: 
        ;BACKGROUND-IMAGE: 
        url 
        (meneame.jpg);PADDING-BOTTOM: 
        5px 
        ;BORDER-LEFT: 
        ;COLOR: 
        #ff6500 
        ;MARGIN-RIGHT: 
        3px 
        ;PADDING-TOP: 
        ;BORDER-BOTTOM: 
        ;TEXT-DECORATION: 
        none 
       

}

 
        div#meneameFyA:hover{ 
       

 
        none 
        ;BACKGROUND-COLOR: 
        #ffc794 
       

}

 
        div#meneameFyA:active{ 
       

 
        #ffc794 
       

}

 
        div#meneameFySPAN.current{ 
       

 
        #ff6500 
        ;FONT-WEIGHT: 
        bold 
        ;PADDING-BOTTOM: 
        #ffbe94 
       

}

 
        div#meneameFySPAN.disabled{ 
       

 
        #ffe3c6 
        #ffe3c6 
        solid 
       

}

 
        </style> 
       

原文链接：https://www.f2er.com/ajax/164478.html

仿淘宝ajax分页控件带例子 编辑

猜你在找的Ajax相关文章

仿淘宝ajax分页控件带例子编辑