Jquery kkpager插件分页

最新推荐文章于 2024-08-16 08:56:47 发布

Winyu_

最新推荐文章于 2024-08-16 08:56:47 发布

阅读量536

点赞数

分类专栏： Java 文章标签： kkpager jquery分页

本文链接：https://blog.csdn.net/lvliyu/article/details/64921033

版权

Java 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

 <!-- kkpager分页 样式 -->
   <link href="<%=basePath%>webapp/css/kkpager_blue.css" rel="stylesheet" />
  <!-- kkpager 分页 js -->
    <script src="<%=basePath%>/webapp/js/kkpager.min.js"></script>

<script type="text/javascript">
    /*分页插件 Ajax加载 */
 $(function(){  
            //初始化函数  
            kkpager.generPageHtml({  
             pno :1, //当前页数  必选
                  total :  3,//总页数  必选
                  totalRecords : 8, //总数据条数  必选
                  mode:'click', //这里设置为click模式  还有一个模式是link
                  click:function(n){ 
                   $.ajax({
     			  type:'post',
    			  url:'<%=basePath%>account/XX.action',//就是数据接口
    			  data:{
      				 'page':n //页码
      				 },
       			success:function(data){
    		  	 var sendStr="";
  		 	 var getUrl;
      			 var arrList=eval("("+data+")");
			//拼接页面信息
     			  for(var i=0;i<arrList.length;i++){
          			getUrl ="<%=basePath%>account/XX.action; //
    				sendStr+="<tr id='tr_"+arrList[i].stationid+"'>";
     				sendStr+="<td>" + (i+1) +"</td>";
 	      			sendStr+="<td>" + arrList[i].staName +"</td>";
    				sendStr+="<td>" + arrList[i].userCount +"</td>";
       				sendStr+="<td>" + arrList[i].openCount +"</td>";
       				sendStr+="<td>"+ arrList[i].forbiddenCount+"</td>";
       				sendStr+="<td><i class='fa fa-times' title='查看' οnclick=\"openWindow('"+getUrl+"')\"></i>";
      				 sendStr+="</td>";
       				sendStr+="</tr>";
       			} 
      			 $("#tbody").html(sendStr); 
       			},
      			 error:function(){
      				 layer.msg('请求失败!',{icon:3,time:2000});//layer框架 需要导入js
      			 }
      		});
                  this.selectPage(n); //手动条用selectPage进行页码选中切换  
                },  
                //设置href链接地址,默认#  
                getHref:function(n){  
                        return "javascript:;;";  
                }  
        });  
    });
  </script>

效果图如下，拼接比较麻烦