在好例子网,分享、交流、成长!
您当前所在位置:首页js 开发实例Ajax框架/RIA → div分页代码示例

div分页代码示例

Ajax框架/RIA

下载此实例
  • 开发语言:js
  • 实例大小:0.03M
  • 下载次数:18
  • 浏览次数:359
  • 发布时间:2018-07-06
  • 实例类别:Ajax框架/RIA
  • 发 布 人:hajadadf
  • 文件格式:.rar
  • 所需积分:5
 相关标签: 分页 div 代码

实例介绍

【实例简介】

【实例截图】

from clipboard

【核心代码】

<html>
<head>
	<script src="jquery.min.js"></script>
	<script>
		$(function(){
			
			<!-- 获取要显示的数据的总数量 -->
			var pageCount=100;
			<!-- 组合完成要显示的字符串 -->
			var allPages="";
			<!-- 定义每页显示的数量 -->
			var listCount=10;
			<!-- 页面的数量 -->
			var pageNumber=0;
			var pageDislay="";
			var indexPage=0;
			if(pageCount%listCount==0)
			{
				pageNumber=pageCount/listCount;
			}else if(pageCount%listCount!=0)
			{
				pageNumber=pageCount/listCount 1;			
			}
			<!-- 通过页面填充数 -->
			function d(index,count,listCount){
				<!-- 显示的开始截至范围 -->
				var startCount=0;
				var endCount=0;
				if(index*listCount>count)
				{
					endCount=count;
				}
				else
				{
					endCount=index*listCount;
					
				}
				startCount=listCount*(index-1) 1;
				
				for(var k=startCount;k<=endCount;k  )
				{
					
					pageDislay ='<table><tr style="border:solid 1px green;"><td style="border:solid 1px green;width:500px;">' k '</td>' '<td style="border:solid 1px green;width:200px;">2323' '</td>' '</tr></table>';
				}
				
				$('#page').empty();
				$('#page').html(pageDislay);
				pageDislay="";
			}
			indexPage=1;
			d(indexPage,pageCount,listCount);
			$('#all').html("共" Math.floor(pageNumber) "页");
			var aLength=$('a').length;
			$('#first').click(function(){
				indexPage=1;
				d(indexPage,pageCount,listCount);
				$('#now').text("当前页为" indexPage);
			})
			$('#next').click(function(){
				indexPage=indexPage 1;
				d(indexPage,pageCount,listCount);
				$('#now').text("当前页为" indexPage);
			})
			$('#pre').click(function(){
				indexPage=indexPage-1;
				d(indexPage,pageCount,listCount);
				$('#now').text("当前页为" indexPage);
			})
			$('#last').click(function(){
				indexPage=pageNumber;
				d(indexPage,pageCount,listCount);
				$('#now').text("当前页为" indexPage);
			})
			$('#now').text("当前为第" indexPage "页");
			 
		});
	</script>
</head>
<body>
    <div id="page">
		
	</div>
	<div id="pagefoot">
		<a href="#" id="first">第一页</a>
		<a href="#" id="next">下一页</a>
		<a href="#" id="now">当前页</a>
		<a href="#"id="all"></a>
		<a href="#"id="pre">上一页</a>
		<a href="#" id="last">最后一页</a>
	</div>
</body>
</html>

标签: 分页 div 代码

实例下载地址

div分页代码示例

不能下载?内容有错? 点击这里报错 + 投诉 + 提问

好例子网口号:伸出你的我的手 — 分享

网友评论

发表评论

(您的评论需要经过审核才能显示)

查看所有0条评论>>

小贴士

感谢您为本站写下的评论,您的评论对其它用户来说具有重要的参考价值,所以请认真填写。

  • 类似“顶”、“沙发”之类没有营养的文字,对勤劳贡献的楼主来说是令人沮丧的反馈信息。
  • 相信您也不想看到一排文字/表情墙,所以请不要反馈意义不大的重复字符,也请尽量不要纯表情的回复。
  • 提问之前请再仔细看一遍楼主的说明,或许是您遗漏了。
  • 请勿到处挖坑绊人、招贴广告。既占空间让人厌烦,又没人会搭理,于人于己都无利。

关于好例子网

本站旨在为广大IT学习爱好者提供一个非营利性互相学习交流分享平台。本站所有资源都可以被免费获取学习研究。本站资源来自网友分享,对搜索内容的合法性不具有预见性、识别性、控制性,仅供学习研究,请务必在下载后24小时内给予删除,不得用于其他任何用途,否则后果自负。基于互联网的特殊性,平台无法对用户传输的作品、信息、内容的权属或合法性、安全性、合规性、真实性、科学性、完整权、有效性等进行实质审查;无论平台是否已进行审查,用户均应自行承担因其传输的作品、信息、内容而可能或已经产生的侵权或权属纠纷等法律责任。本站所有资源不代表本站的观点或立场,基于网友分享,根据中国法律《信息网络传播权保护条例》第二十二与二十三条之规定,若资源存在侵权或相关问题请联系本站客服人员,点此联系我们。关于更多版权及免责申明参见 版权及免责申明

;
报警