bootstrap-paginator分页插件使用

1.导入bootstrap-paginator.js和bootstrapv3.min.css

<script src="<%=path %>/static/js/bootstrap-paginator.js"></script> 

<link href="<%=path %>/static/css/bootstrapv3.min.css" rel="stylesheet" type="text/css"/>

2.分页div

<div style="text-align: center"> <ul id="paging"></ul></div>

3.分页启动函数

$(function(){
$('#paging').bootstrapPaginator({ 
currentPage: ${page.pageNum},    
totalPages: ${page.pages},    
size:"normal",    
bootstrapMajorVersion: 3,    
alignment:"right",    
numberOfPages:5, 
shouldShowPage:true,
itemTexts: function (type, page, current) {        
switch (type) {            
case "first": return "首页";            
case "prev": return "上一页";            
case "next": return "下一页";            
case "last": return "末页";            
case "page": return page;
 }
},
//点击事件
onPageClicked: function (event, originalEvent, type, page) {
  var loginName = $("#suname").val();
location.href="<%=request.getContextPath()%>/dlrz/list?pageNum=" + page+"&loginName="+loginName;
}
});

});

效果:



评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值