FinallyDisplay page:
We can see that at any level, there is nothing different from the traditional one. Only the jsp part removes the file header (in fact, it does not remove the file header). In addition, we can also see that, A page has been divided into several parts. As I mentioned earlier, it is a modular structure (this is a structure proposed by the author when I saw a. net Framework Structure on the Internet. I think it is good and I applied it to JSP ).
I have made some reservations for some details. Please understand. However, the general framework is tested by IE and FireFox. I think about some functional extensions.
Principle:Actually, the page recursion is applied! Just like a general recursive method, but it is only used on the page.
<Div id = "tr $ {m. id}">
Loop to display the objects encapsulated into the vector one by one
For {
If (if it is the top menu sub = N ){
<Div id = "t $ {m. id}" onClick = "ShowMenu ($ {m. father...})">
Show menu content
</Div>
<! -- The content is not displayed here. It is only used as the next container -->
<Div style = "display: none" id = "td $ {m. id...}"> </div>
} Else {
<Div onClick = "OpenMenu ($ {m. id})"> display menu content </div>
}
}
</Div>
The showMenu (father, id...) method calls this page again after obtaining data from the server based on the passed-in father. In this case, the page content is displayed in the new ID. In this way, it looks like the tree menu in MSDN.
Advantage: Multi-Level menus are obtained multiple times, which speeds up the response. ajax requests are also applied, making the page flickering invisible and highly friendly. In addition, code can be added to JS so that users do not need to obtain server data every time they click. Instead, they can first determine whether there is any content and no more data... At the same time, menus and pages are synchronized. You can open the page at the corresponding place for each level menu opened. Similarly, operMenu () can also be ajax.
EffectYou can go to the http://www.start.com/Look:
<% @ Page contentType = "text/html; charset = GB2312" %>
<Meta http-equiv = Content-Type content = "text/html; charset = gb2312">
<Style>
. Text1: hover {border: 1px #999999 solid; background-color: # CCCCCC; height: 12px ;}
. Text1 {border: 1px # FFFFFF solid; height: 12px ;}
</Style>
<Script type = "" src = "js/Function. js"> </script>
Function ini (){
Bcandy ("0", "menu. jsp", "id = 0 & father = 0", "menu. js ");
}
</Script>
<Body onload = "ini ();">
<Div id = "load" style = "z-index: 1; color: # FF0000; visibility: hidden; filter: Alpha (opacity = 85); background-color: # FFFFFF; left: 48%; top: 48%; BORDER-RIGHT: #000000 1px solid; PADDING-RIGHT: 12px; BORDER-TOP: #000000 1px solid; PADDING-LEFT: 12px; PADDING-BOTTOM: 12px; BORDER-LEFT: #000000 1px solid; LINE-HEIGHT: 22px; PADDING-TOP: 12px; BORDER-BOTTOM: #000000 1px solid; POSITION: absolute; ">
<br>
Processing Data. Please wait...
<Br>
</Div>
<Div id = "0" align = "center">
</Div>
</Body>
</Html>