PageNavigater 2.0(含ASP.NET DEMO)

PageNavigater 2.0 Sinoprise Technology Studio Copyright (c) 2008 Kevin Yin http://www.sinoprise.cn http://www.sinoprise.com This script can be used freely as long as all copyright messages are intact. //====================================================== Updated: 2008/01/28 PageNavigater 2.0 JavaScript分页控件2.0 以前写的分页控件都是和相关技术有关的，这是一个JavaScript写的分页控件，与服务器端的技术，如ASP,ASP.NET，PHP，JSP等无关，只需要在相应的地方输出信息即可; 调用方式： 用动态Web语言在HTML界面上输出如下代码： <script language="javascript"> pager = new PageNavigater(20, 255, 1, "http://www.sinoprise.cn/default.aspx","?","pageindex") ; document.write(pager); </script> 即可 关于PageNavigater的参数信息： 第一个参数，如上例中的20， 表示一页有多少条数据 第二个参数，如上例中的255，表示总共有多少条数据 第三个参数，如上例中的1，表示当前页为第1页 第四个参数，如上例中的“http://www.sinoprise.cn/default.aspx”, 表示分页控件导航的目的地址 第五个参数，如上例中的“?”，表示分页的变量与其他变量的分隔符，如果是第一个参数，这个分隔符应该是“？”， 如果是他的分隔符，即此变量前还有其他的变量，分隔符应该是“&” 第六个参数，如上例中的“pageindex”，表示分页时的变量，来指定分页的号码，在服务器端的动态 网页中取此参数即可得到用户的导航页码。 分页控件将组成形如：http://www.sinoprise.cn/default.aspx？pageindex=...的链接地址 ASP.NET示例： 编码： ................... protected int _recordCount = 531; protected int _currentPage = 0; protected int _pageSize = 25; protected string _pageUrl = "http://localhost:33167/Default.aspx"; protected string _splitString = "?"; protected string _pageVariable = "pageindex"; protected void Page_Load(object sender, EventArgs e) { string cp = Request.QueryString[_pageVariable]; if (null != cp) _currentPage = Convert.ToInt32(cp); else _currentPage = 1; } .................... HTML代码： script language="javascript"> pager = new PageNavigater(<%=_pageSize%>, <%=_recordCount%>, <%=_currentPage%>, "<%=_pageUrl%>","<%=_splitString%>","<%=_pageVariable%>") ; document.write(pager); </script> 比第一版的更改有： 1.将样式表从代码中提出，便于修改 2.将分页控件的风格改为现代风格 3.增加分页跳转 4.修正了分页列表显示不正确的BUG 注，此分页控件依赖于样式表定义，一下是一个样式表定义的DEMO: .PageNavigater { FONT-SIZE: 12px; FONT-STYLE: normal; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-ALIGN: right; LIST-STYLE-TYPE: none; MARGIN-BOTTOM: 5px; PADDING-RIGHT: 5px; PADDING-LEFT: 5px; PADDING-BOTTOM: 5px; PADDING-TOP: 5px; LINE-HEIGHT: 20px; TEXT-ALIGN: right; FLOAT: right; COLOR: #006aa7; } .PageNavigater A { COLOR: #006aa7; TEXT-DECORATION: none; } .PageNavigater A:hover { COLOR: #f60; TEXT-DECORATION: underline; } .PageNavigater IMG { BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; VERTICAL-ALIGN: middle; BORDER-RIGHT-WIDTH: 0px; } .PageNavigaterItem { BORDER-RIGHT: #b2bfcf 1px solid; BORDER-LEFT: #b2bfcf 1px solid; BORDER-BOTTOM: #b2bfcf 1px solid; BORDER-TOP: #b2bfcf 1px solid; PADDING-RIGHT: 6px; PADDING-BOTTOM: 0px; PADDING-LEFT: 6px; PADDING-TOP: 0px; DISPLAY: block; BACKGROUND: #fff; FLOAT: left; LINE-HEIGHT: 22px; MARGIN-RIGHT: 4px; HEIGHT: 22px; VERTICAL-ALIGN: middle; } .PageNavigaterItem INPUT { FONT-SIZE: 12px; FONT-FAMILY: Arial, Helvetica, sans-serif; LIST-STYLE-TYPE: none; BORDER-RIGHT: #bdc5ca 0px solid; BORDER-TOP: #6f787e 0px solid; BORDER-LEFT: #6f787e 0px solid; BORDER-BOTTOM: #bdc5ca 0px solid; PADDING-BOTTOM: 3px; PADDING-LEFT: 2px; PADDING-RIGHT: 2px; PADDING-TOP: 3px; BACKGROUND: none transparent scroll repeat 0% 0%; WIDTH: 20px; LINE-HEIGHT: 16px; HEIGHT: 14px; VERTICAL-ALIGN: middle; } .PageNavigater #Focus { BORDER-RIGHT: #1d619c 1px solid; BORDER-TOP: #1d619c 1px solid; BACKGROUND: #1972bd; BORDER-LEFT: #1d619c 1px solid; COLOR: #fff; BORDER-BOTTOM: #1d619c 1px solid; } 可以按照自己的需要修改样式表，但不能改变样式表的名称（除非一起改动代码） 下载地址： http://www.sinoprise.cn/showtopic-26.aspx //====================================================== Updated: 2008/01/24 PageNavigater 1.0 JavaScript分页控件1.0（page-navigater_V_1.0.0.zip） 以前写的分页控件都是和相关技术有关的，这是一个JavaScript写的分页控件，与服务器端的技术，如ASP,ASP.NET，PHP，JSP等无关，只需要在相应的地方输出信息即可; 调用方式： 用动态Web语言在HTML界面上输出如下代码： <script language="javascript"> pager = new PageNavigater(20, 1000000, 243, "right", http://www.sinoprise.cn/) ; document.write(pager); </script> 即可 关于PageNavigater的参数信息： 第一个参数，如上例中的20， 表示一页有多少条数据 第二个参数，如上例中的1000000，表示总共有多少条数据 第三个参数，如上例中的243，表示当前页为第243页 第四个参数，如上例中的right,表示分页控件的表格右对齐（即显示在页面的右边） 第五个参数，如上例中的http://www.sinoprise.cn/，表示导航的网页地址，PageNavigater将生成形如 http://www.sinoprise.cn/?pageindex=....的链接地址，在服务器端的动态 网页中取参数pageindex即可得到用户的导航页 下载地址：http://www.sinoprise.cn/showtopic-22.aspx