如何用JS将数据在页面上分页显示出来

如何用JS将数据在页面上分页显示出来,第1张

在servlet的service()方法中只需进行如下 *** 作:

PageControl

 pageCtl

=

yourBusinessObjectlistData(reqgetParameter("jumpPage"));

reqsetAttribute("pageCtl",pageCtl);

说明:yourBusinessObject封装了商业逻辑,是位于Business

Logic

Layer中的一个对象,运用OOAD的方法,封装商业对象,在Persistent

Layer之上组建坚实的Business

Logic

Layer同样是构建大型电子商务架构的关键所在。本文的关注点只是分页处理,暂不详细论述

在每个想要实现翻页显示数据的jsp页面中,我们的工作也很简单,其代码是公式化的:

<jsp:useBean

id="pageCtl"

class="yourpackagePageControl"

scope="request"></jsp:useBean>

<%if(pageCtlmaxPage!=1)){%>

<form

name="PageForm"

 action="/servlet/yourpackageyourservlet"

method="post">

<%@

include

file="/yourpath/pagemanjsp"%>

</form>

<%}%>

说明:

if(pageCtlmaxPage!=1)实现了这样一个逻辑:如果所取得数据不足一页,那么就不用进行翻页显示。

我们注意到<%@

include

file="/yourpath/pagemanjsp"%>这使得真正的翻页部分完全得到了重用

那么pagemanjsp到底做了些什么呢?它实现了经常做翻页处理的人耳熟能详的逻辑 

(A)第一页时不能再向前翻; 

(B)最后一页时不能再向后翻; 

同时能够进行页面任意跳转,具体代码如下:

每页<%=pageCtlrowsPerPage%>行

共<%=pageCtlmaxRowCount%>行

第<%=pageCtlcurPage%>页

共<%=pageCtlmaxPage%>页

<BR>

<%if(pageCtlcurPage==1){

outprint("

首页

上一页");

 

}else{

 %>

 

<A

HREF="javascript:gotoPage(1)">首页</A>

<A

HREF="javascript:gotoPage(<%=pageCtlcurPage-1%>)">上一页</A>

<%}%>

<%if(pageCtlcurPage==pageCtlmaxPage){

outprint("下一页

尾页");

 

}else{

 %>

 

<A

HREF="javascript:gotoPage(<%=pageCtlcurPage+1%>)">下一页</A>

<A

HREF="javascript:gotoPage(<%=pageCtlmaxPage%>)">尾页</A>

<%}%>

转到第<SELECT

name="jumpPage"

onchange="Jumping()">

 

 

<%

for(int

i=1;i<=pageCtlmaxPage;i++)

 {

 

 

if

(i==

pageCtlcurPage){

 

 

%>

 

 

<OPTION

selected

value=<%=i%>><%=i%></OPTION>

 

 

<%}else{%>

 

 

<OPTION

value=<%=i%>><%=i%></OPTION>

 

 

<%}}%>

 

 

 

</SELECT>页

最后附上用于页面跳转的javascript公共函数:

function

Jumping(){

 documentPageFormsubmit();

 return

;

}

function

gotoPage(pagenum){

 documentPageFormjumpPagevalue

=

pagenum;

 documentPageFormsubmit();

 return

;

}

运行效果:

在页面刷新的时候也发送一个请求就行了

reload 方法,该方法强迫浏览器刷新当前页面。

语法:locationreload([bForceGet]) 参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页。true, 则以 GET 方式,从服务端取最新的页面, 相当于客户端点击 F5("刷新")

replace 方法,该方法通过指定URL替换当前缓存在历史里(客户端)的项目,因此当使用replace方法之后,你不能通过“前进”和“后退”来访问已经被替换的URL。

语法: locationreplace(URL)

在实际应用的时候,重新刷新页面的时候,我们通常使用: locationreload() 或者是 historygo(0) 来做。因为这种做法就像是客户端点F5刷新页面,所以页面的method="post"的时候,会出现"网页过期"的提示。那是因为Session的安全保护机制。可以想到: 当调用 locationreload() 方法的时候, aspx页面此时在服务端内存里已经存在, 因此必定是 IsPostback 的。如果有这种应用: 我们需要重新加载该页面,也就是说我们期望页面能够在服务端重新被创建, 我们期望是 Not IsPostback 的。这里,locationreplace() 就可以完成此任务。被replace的页面每次都在服务端重新生成。

你可以这么写: locationreplace(locationhref);

返回并刷新页面:

locationreplace(documentreferrer);

documentreferrer //前一个页面的URL

不要用 historygo(-1),或 historyback();来返回并刷新页面,这两种方法不会刷新页面。

附:

Javascript刷新页面的几种方法:

1 historygo(0)

2 locationreload()

3 location=location

4 locationassign(location)

5 documentexecCommand('Refresh')

6 windownavigate(location)

7 locationreplace(location)

8 documentURL=locationhref

自动刷新页面的方法:

1页面自动刷新:把如下代码加入<head>区域中

<meta >

以上就是关于如何用JS将数据在页面上分页显示出来全部的内容,包括:如何用JS将数据在页面上分页显示出来、jsp 点击刷新,怎么执行action、等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址:https://www.54852.com/web/10160187.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-05
下一篇2023-05-05

发表评论

登录后才能评论

评论列表(0条)

    保存