首页 javaWEB bootstrap实现分页效果(只需控制条数,页数,和当前页数)

bootstrap实现分页效果(只需控制条数,页数,和当前页数)

页面上: <ul class=”pagination” id=”paginat…

页面上:

<ul class=”pagination” id=”pagination”> </ul>

js

	$(document).ready(function() {
		if($("#pagination")){
			var pagecount = <%= locals.pagecount %>;
			var pagesize = <%= locals.pagesize %>;
			var currentpage = <%= locals.currentpage %>;
			var counts,pagehtml="";
			if(pagecount%pagesize==0){
				counts = parseInt(pagecount/pagesize);
			}else{
				counts = parseInt(pagecount/pagesize)+1;
			}
			//只有一页内容
			if(pagecount<=pagesize){pagehtml="";}
			//大于一页内容
			if(pagecount>pagesize){
				if(currentpage>1){
					pagehtml+= '<li><a href="/course/index/'+(currentpage-1)+'">上一页</a></li>';
				}
				for(var i=0;i<counts;i++){
					if(i>=(currentpage-3) && i<(currentpage+3)){
						if(i==currentpage-1){
							pagehtml+= '<li class="active"><a href="/course/index/'+(i+1)+'">'+(i+1)+'</a></li>';
						}else{
							pagehtml+= '<li><a href="/course/index/'+(i+1)+'">'+(i+1)+'</a></li>';
						}

					}
				}
				if(currentpage<counts){
					pagehtml+= '<li><a href="/course/index/'+(currentpage+1)+'">下一页</a></li>';
				}
			}
			$("#pagination").html(pagehtml);
		}
	});

具体参数,效果如下

page page2

 

免责声明:文章内容不代表本站立场,本站不对其内容的真实性、完整性、准确性给予任何担保、暗示和承诺,仅供读者参考,文章版权归原作者所有。如本文内容影响到您的合法权益(内容、图片等),请及时联系本站,我们会及时删除处理。

为您推荐

nodejs 整理记录

nodejs 整理记录

下载包 https://blog.csdn.net/m0_59878114/article/details/120274...
websocket测试html

websocket测试html

<!DOCTYPE html> <html> <head> <meta cha...
bigdemical两个数比较大小

bigdemical两个数比较大小

/*int result = bigdemical1.compareTo(bigdemical2) result = -...
Beetl2.7 中文文档

Beetl2.7 中文文档

Beetl目前版本是2.7.23,相对于其他java模板引擎,具有功能齐全,语法直观,性能超高,以及编写的模板容易维护等...
纯CSS实现多个便签在一行展示,拖动滚动

纯CSS实现多个便签在一行展示,拖动滚动

div <h2>请注意需要在移动端预览,PC端拖拽无效果</h2> <div class=...
返回顶部