📄 ajax分页查询程序 - ajax - 4s资讯社--分享与交流.htm
字号:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<!-- saved from url=(0046)http://www.4studio.cn/www/42/2008-04/2418.html -->
<HTML xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>Ajax分页查询程序 - AJAX - 4s资讯社--分享与交流</TITLE>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
<META
content="4s,4studio,4s资讯社,4s it资讯,IT信息,分享互相网,网站运营,Web2.0,推广优化,建站心得,网络创业,策划盈利,电子商务"
name=keywords>
<META content=4s资讯社--收集网络上热门的IT信息,提供分享与交流的平台,让大家在此找到快乐!! name=description><LINK
href="Ajax分页查询程序 - AJAX - 4s资讯社--分享与交流.files/style.css" type=text/css
rel=stylesheet>
<SCRIPT language=javascript
src="Ajax分页查询程序 - AJAX - 4s资讯社--分享与交流.files/select_card.js"
type=text/javascript></SCRIPT>
<LINK title=RSS href="http://www.4studio.cn/rss.php?cid=42"
type=application/rss+xml rel=alternate><LINK href="favicon.ico"
type=image/x-icon rel=icon><LINK href="favicon.ico" type=image/x-icon
rel="shortcut icon">
<META content="MSHTML 6.00.2900.3314" name=GENERATOR></HEAD>
<BODY><!--BEGIN container-->
<DIV class=container><!--BEGIN HEADER-->
<DIV class=header>
<DIV class=header_top><ACRONYM class=acronym_11><A
href="http://www.4studio.cn/">http://www.4studio.cn/</A></ACRONYM> <SPAN><A
onclick="this.style.behavior='url(#default#homepage)';this.setHomePage('http://www.4studio.cn/');"
href="http://www.4studio.cn/#">设为首页</A> | <A href="http://www.4studio.cn/blog/"
target=_blank>4studio博客</A> | <A href="http://www.4studio.cn/rss_map.html"
target=_blank>RSS订阅</A> </SPAN></DIV>
<DIV class=header_main>
<DIV class=header_fix>
<UL>
<LI id=li_1><IMG src="Ajax分页查询程序 - AJAX - 4s资讯社--分享与交流.files/logo.gif"
border=0> </LI>
<LI id=li_3>
<SCRIPT language=javascript
src="Ajax分页查询程序 - AJAX - 4s资讯社--分享与交流.files/468_60.js"></SCRIPT>
</LI></UL>
<DIV class=header_nav> <A href="http://www.4studio.cn/">首页</A> <A
href="http://www.4studio.cn/www/1/index.html">IT互联</A> <A
href="http://www.4studio.cn/www/69/index.html">Web2.0</A> <A
href="http://www.4studio.cn/www/23/index.html">推广优化</A> <A
href="http://www.4studio.cn/www/72/index.html">网络创业</A> <A
href="http://www.4studio.cn/www/25/index.html">策划盈利</A> <A
href="http://www.4studio.cn/www/26/index.html">建站心得</A> <A
href="http://www.4studio.cn/www/73/index.html">站长故事</A> <A
href="http://www.4studio.cn/www/82/index.html">Windows Server 2008</A> <A
href="http://www.4studio.cn/www/70/index.html">电子商务</A> <A
href="http://www.4studio.cn/www/75/index.html">原创天地</A> <A
href="http://www.4studio.cn/www/76/index.html">分享</A> </DIV>
<DIV class=header_search>
<DIV class=hot_search>热门关键词: <A href="http://www.4studio.cn/tag.php?Web2.0"
target=_blank>Web2.0</A> <A href="http://www.4studio.cn/tag.php?Ajax"
target=_blank>Ajax</A> <A href="http://www.4studio.cn/tag.php?CSS"
target=_blank>CSS</A> <A
href="http://www.4studio.cn/tag.php?%E6%8E%A8%E5%B9%BF"
target=_blank>推广</A> <A href="http://www.4studio.cn/tag.php?PHP"
target=_blank>PHP</A> <A
href="http://www.4studio.cn/tag.php?%E5%88%9B%E4%B8%9A"
target=_blank>创业</A></DIV>
<DIV class=search_form>
<FORM action=search.php method=post><SPAN><INPUT class=search_input id=keyword
name=keyword><INPUT id=s_type type=hidden value=simple name=s_type><INPUT
id=step type=hidden value=2 name=step></SPAN> <SPAN><INPUT class=search_button type=submit value="搜 索" border=0></SPAN> <INPUT
id=mid type=hidden value=1 name=mid><!--value=1 即为新闻资讯内容模型-->
</FORM></DIV></DIV></DIV></DIV></DIV><!--END HEADER--><!--BEGIN MAIN-->
<DIV class=main>
<DIV class=article_fix_height>
<DIV class=article_left>
<DIV class=article_main>
<DIV class=postion><A href="http://www.4studio.cn/">4s资讯社</A> > <A
href="http://www.4studio.cn/www/6/index.html">网络编程</A> > <A
href="http://www.4studio.cn/www/42/index.html">AJAX</A> </DIV>
<DIV class=article_title>Ajax分页查询程序</DIV>
<DIV class=article_info>作者： <ACRONYM class=acronym_11>2008-04-01
21:55</ACRONYM> 来源: Ajax中国 </DIV>
<DIV class=tags>相关标签: <A href="http://www.4studio.cn/tag.php?%E5%88%86%E9%A1%B5"
target=_blank>分页</A> <A href="http://www.4studio.cn/tag.php?AJAX"
target=_blank>AJAX</A> <A
href="http://www.4studio.cn/tag.php?%E7%A8%8B%E5%BA%8F"
target=_blank>程序</A> <A
href="http://www.4studio.cn/tag.php?%E6%9F%A5%E8%AF%A2" target=_blank>查询</A>
</DIV>
<DIV class=prev_next><SPAN> <A title=ajax使用XMLHttpRequest与DOM对象
href="http://www.4studio.cn/www/42/2008-03/2390.html">ajax使用XMLHttpRequest与DOM对象</A>
<ACRONYM class=acronym_10>>> </ACRONYM></SPAN></DIV>
<DIV class=article_content id=content>
<DIV class=t_msgfont id=postmessage_6505>
<DIV class=blockcode>
<H5> </H5>
<H5><SPAN class=t_tag onclick=tagshow(event)
href="tag.php?name=%B4%FA%C2%EB">代码</SPAN>:</H5><CODE id=code0><<SPAN
class=t_tag onclick=tagshow(event) href="tag.php?name=div">div</SPAN> id="<SPAN
class=t_tag onclick=tagshow(event)
href="tag.php?name=div">div</SPAN>_trackpoint" style=" border:solid 1px gray;
height:230px; width:99%; overflow-y:auto;">用于显示<SPAN class=t_tag
onclick=tagshow(event) href="tag.php?name=%B2%E9%D1%AF">查询</SPAN>回的<SPAN
class=t_tag onclick=tagshow(event)
href="tag.php?name=%CA%FD%BE%DD">数据</SPAN></<SPAN class=t_tag
onclick=tagshow(event) href="tag.php?name=div">div</SPAN>><BR>
<div id="div_trackpages" style=" height:15px; width:99%; font-size:8pt;
Word-break:break-all; word-wrap: break-word;">用于显示分页的页码</div><br
/><BR> <div id="div_trackpagetab" style=" height:15px;
width:99%; font-size:8pt; text-align:center;">用于显示前一页、后一页、...、<SPAN
class=t_tag onclick=tagshow(event)
href="tag.php?name=%CA%D7%D2%B3">首页</SPAN>、尾页等控制按钮</div><BR>
<div id="div_trackpage_status" style=" height:20px; width:99%; font-size:8pt;
text-align:center;">用于显示当前页的页码</div><BR>
实现客户端分页函数：<BR> var CurPage=0;
//当前页<BR> var TotalPage=0;
//总页数<BR> var PageTab=7;
//每组显示页数<BR> var CurTab=0;
//当前分组<BR> </CODE></DIV>我的<SPAN class=t_tag
onclick=tagshow(event)
href="tag.php?name=%B3%CC%D0%F2">程序</SPAN>是设置每页显示50条数据，每组显示7页，这些可以按需求调整。<BR>
TurnTab函数用于切换分组，根据传入的val来计算显示哪一组<SPAN class=t_tag onclick=tagshow(event)
href="tag.php?name=%D2%B3%C3%E6">页面</SPAN>。val=1表示切换到下一组，val=-1表示切换到上一组，0表示切换到第一组，-2表示切换到最后一组。<SPAN
class=t_tag onclick=tagshow(event)
href="tag.php?name=%D3%C3%BB%A7">用户</SPAN>通过单击<SPAN class=t_tag
onclick=tagshow(event)
href="tag.php?name=%D2%B3%C3%E6">页面</SPAN>上的 ... 符号来切换分组。
<DIV class=blockcode>
<H5>代码:</H5><CODE id=code1>function TurnTab(val)<BR>{<BR> var nPage
= 0;<BR> <BR> if (val == 1) {<BR>
CurTab++;<BR> nPage =
(CurTab - 1) * PageTab + 1; <BR> }<BR> else
if (val == -1) {<BR> CurTab--;<BR>
nPage = (CurTab - 1) * PageTab + 1;<BR>
}<BR> else if (val == 0) {<BR>
CurTab = 1;<BR> nPage =
1;<BR> }<BR> else if (val == -2) {<BR>
CurTab = Math.floor(TotalPage / PageTab) +
1;<BR> nPage = (CurTab - 1) * PageTab +
1;<BR> }<BR> <BR>
var carinfo = document.getElementById("div_trackpages");<BR> var
tabinfo = document.getElementById("div_trackpagetab");<BR> var
strInner = "";<BR>strInner += "<a
href=\"javascript:TurnPage(1)\">首页</a> ";<BR> <BR>
strInner += "<a href=\"Javascript:PreviousPage()\">前一页</a>
";<BR> <BR> strInner += "总共" + TotalPage + "页
";<BR> <BR> strInner += "<a
href=\"javascript:NextPage()\">下一页</a> ";<BR> <BR>
strInner += "<a href=\"javascript:TurnPage(" + TotalPage +
")\">尾页</a> ";<BR> <BR> tabinfo.innerHtml =
strInner;<BR> <BR> strInner = "";<BR>
<BR> if (CurTab > 1) strInner += "<a
href=\"javascript:TurnTab(-1)\">...</a> ";<BR> <BR>
for ( ; nPage<=CurTab*PageTab; nPage++) {<BR>
<BR> if (nPage <=
TotalPage) {<BR> <BR>
strInner += "<a
href=\"javascript:TurnPage("+ nPage + ")\">"+nPage+"</a> "<BR>
<BR>
}<BR> }<BR> <BR> if
(nPage < TotalPage) strInner += "<a
href=\"javascript:TurnTab(1)\">...</a> ";<BR> <BR>
carinfo.innerHTML = strInner;<BR>
<BR>}</CODE></DIV>TurnPage函数用于切换分页，val表示要切换到的页数，根据要显示的页数生成查询范围，如查询前50条记录，从51到100的记录，从101到150的记录。。。<BR>
cscCustomAnalyst是一个异步调用函数，函数实现的代码将在下面贴出。"Method","SID", "TIME1", "TIME2",
"ROW1", "ROW2"都是执行查询所需的<SPAN class=t_tag onclick=tagshow(event)
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -