文档章节

javascript 分页算法

施长成
 施长成
发布于 2016/05/05 17:32
字数 166
阅读 344
收藏 5

分页需求:

根据当前页面,显示当前页面的前3页和后3页,在非第一页或最后一页显示【上一页和【下一页】,当超过页码时使用【...】 控制。

<!DOCTYPE html>
<html>
<head>
	<title>分页算法</title>
	<meta charset="utf-8">
</head>
<body>


<script type="text/javascript">
	function showPages(page,total) {
		var str = page+" ";

		for (var i = 1; i <=3; i++) {
			if( page -i>1 ){
				str = page-i+" "+str;
			}
			if( page+i<total ){
				str = str + " "+(page+i);
			}
		}

		if(page - 4 >1){
			str = "..." + str;
		}

		if(page > 1){
			str = "上一页" + 1 +" "+str;
		}

		if( page+4<total ){
			str = str + "...";
		}

		if( page<total ){
			str = str+" "+total+"下一页";
		}
		return page +"--"+str;

	}


	var total = 110;
	for (var i = 1; i <= total; i++) {
		var ret = showPages(i,total);
		console.log(ret);
	}

</script>

</body>
</html>


本文转载自:http://f2e.souche.com/blog/ru-he-xie-ge-jian-dan-de-fen-ye/

施长成
粉丝 7
博文 67
码字总数 24489
作品 0
浦东
后端工程师
私信 提问
加载中

评论(2)

施长成
施长成 博主

引用来自“bossin2014”的评论

最后的return是什么作用

hello,这个return 并没有实际作用,只是返回一个 类似 分页效果的一串数字。来体现这个算法。
bossin2014
bossin2014
最后的return是什么作用
java或js,ajax或jquery分页代码吗最好就是含有一些高级的算法来分页,

谁有更好的java或js,ajax或jquery分页代码吗最好就是含有一些高级的算法来分页,S2SH框架使用 1 分钟前Thomas8sky | 分类:JAVA相关 | 浏览1次 最近想学会优化代码,学习一些高级的算法,来提...

天池番薯
2014/02/23
332
1
bootstrap-table 分页增删改查之一(分页)

本文转载于:猿2048网站bootstrap-table 分页增删改查之一(分页) 记录一下 bootstrap-table插件的使用 先看下效果图 首先是导入js <!--js jquery --><script type="text/javascript" src="$......

前端老手
09/02
32
0
13 个最佳 JavaScript 数据表格库

JavaScript 是一种通常被用在网页开发中的编程语言。它主要是在互联网上的网页浏览器中开发出效果出众且可交互的特效。它是客户端脚本语言中的一种,是被用来作为通过用户的网页浏览器进行处...

oschina
2017/03/10
7.3K
7
基于 jQuery 的 JavaScript 分页组件 - Pagination

Pagination 是一个基于 jQuery 实现的一个简单的 JavaScript 分页组件,主要实现以下功能: 1. 方便在 JavaScript 中对后端分页数据进行展示 2. 自动生成分页组件,包括首页、页码、末页、页...

勤劳的小木匠
2018/07/19
7.6K
0
SlidesJS基本使用方法_已整理

来源 MZB大豆博客 Slides – 是一个简单的,容易定制和风格化,的jQuery幻灯片插件。 Slides提供褪色或幻灯片过渡效果,图像淡入淡出,图像预压,自动生成分页,循环,自动播放的自定义等很多...

辣条拌鱼翅
2015/01/01
77
0

没有更多内容

加载失败,请刷新页面

加载更多

好程序员大数据教程Scala系列之样例类_Option_偏函数

  好程序员大数据教程Scala系列之样例类_Option_偏函数,在Scala中Option类型样例类用来表示可能存在或也可能不存在的值(Option的子类有Some和None)。Some包装了某个值,None表示没有值。 ...

好程序员官网
20分钟前
3
0
zk中ServerCnxnFactory连接管理工厂

作为ServerCnxn的工厂抽象类 属性 ZOOKEEPER_SERVER_CNXN_FACTORY zookeeper.serverCnxnFactory secure 在ServerCnxnFactory中SSL是否启用 sessionMap session管理配置中信息(sessionId,Ser......

writeademo
21分钟前
3
0
【代码审计01】几种常见的漏洞种类以及代码审计工具

前言 代码审计是在经过黑盒测试完毕,也就是检查应用的基本功能是否符合产品业务需求下进行的。需要有一定的编码基础以及对漏洞形成原理的基本认知,通过工具或者经验检测中代码中可能出现的...

北桥苏
23分钟前
4
0
重磅发布 | 全球首个云原生应用标准定义与架构模型 OAM 正式开源

作者: OAM 项目负责人 导读:2019 年 10 月 17 日,阿里巴巴合伙人、阿里云智能基础产品事业部总经理蒋江伟(花名:小邪)在 Qcon 上海重磅宣布,阿里云与微软联合推出开放应用模型 Open A...

阿里巴巴云原生
24分钟前
3
0
【进阶之定义函数】一个查询树结构数据的集合

1、基本定义 delimiter 自定义符号  -- 如果函数体只有一条语句, begin和end可以省略, 同时delimiter也可以省略create function 函数名(形参列表) returns 返回类型  -- 注意是retru...

卯金刀GG
31分钟前
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部