MSDN 和 左边导航树的效果都是在点击父节点时,再发出请求填充其子节点!好像网页只刷新部分! JavaScript + [ASP + Access] 实现
源程序下载: http://www.triaton.com.cn/Private/Zip/Tree.zip
<!-- Tree.asp --><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE> New Document </TITLE><META NAME="Generator" CONTENT="EditPlus"><META NAME="Author" CONTENT=""><META NAME="Keywords" CONTENT=""><META NAME="Description" CONTENT=""></HEAD><BODY><iframe width="100%" height="30" id="hiddenframe"></iframe><script>function ExpandNode(ParentNode,ParentId){var NodeX = eval(ParentNode.id + '_0');if (NodeX.style.display == 'none') { NodeX.style.display="block"; if (NodeX.loaded == 'no') { document.frames['hiddenframe'].location.replace("http://localhost/dvbbs/subtree.asp?PID=" + ParentId + "&PNode=" + ParentNode.id); NodeX.loaded = 'yes'; } }else { NodeX.style.display='none'; }}</script><CENTER><TABLE border="1" width="20%" height="60%"> <TR> <TD> <DIV style="OVERFLOW: auto;WIDTH: 100%;HEIGHT:100%"> <TABLE width =300%> <TR> <TD><% dim adoConnection set adoConnection = Server.CreateObject("ADODB.Connection") 'adoConnection.Open "Provider=SQLOLEDB.1;Persist Security Info=False;User ID=sa;Initial Catalog=Test;Data Source=TRIATON/PSQL2KE" adoConnection.Open "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" & Server.mappath("/dvbbs") & "/Tree.mdb;Persist Security Info=False" dim adoRecordset set adoRecordset = Server.CreateObject("ADODB.Recordset") adoRecordset.Open "select *,(select count(*) from tree where parentid = T.id) as children from tree T where rootid = id ",adoConnection dim i i=0 do until adoRecordset.eof %><div id='Node_<% = i %>'> <a href='#'<% if adoRecordset.Fields.item("Children").value >0 then %> onClick='ExpandNode(Node_<% = i %>,<% =adoRecordset.Fields.item("id").value%>)'>+</a> <% else %> >-</a> <% end if%><a href='#' onDblClick='ExpandNode(Node_<% = i %>,<% =adoRecordset.Fields.item("id").value%>)'><% =adoRecordset.Fields.item("remark").value%></a></div> <div id='Node_<% = i %>_0' style='display: none' loaded='no'> 正在加载 ... </div><% i=i+1 adoRecordset.MoveNext loop adoRecordset.close set adoRecordset = nothing adoConnection.close set adoConnection = nothing%> </TD> </TR> </TABLE> </DIV> </TD> </TR></TABLE></CENTER></BODY></HTML>
<!-- SubTree.asp --><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE> New Document </TITLE><META NAME="Generator" CONTENT="EditPlus"><META NAME="Author" CONTENT=""><META NAME="Keywords" CONTENT=""><META NAME="Description" CONTENT=""></HEAD><BODY><% dim parentid parentid = request.querystring("PID") parentnode = request.querystring("Parentnode") dim adoConnection set adoConnection = Server.CreateObject("ADODB.Connection")' adoConnection.Open "Provider=SQLOLEDB.1;Persist Security Info=False;User ID=sa;Initial Catalog=Test;Data Source=TRIATON/PSQL2KE"
adoConnection.Open "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" & Server.mappath("/dvbbs") & "/Tree.mdb;Persist Security Info=False" dim adoRecordset set adoRecordset = Server.CreateObject("ADODB.Recordset") adoRecordset.Open "select *,(select count(*) from tree where parentid =T.id ) as Children from tree T where parentid = " & parentid ,adoConnection response.write adoRecordset.source dim i Dim SHTML dim parentnode parentnode = request.querystring("Pnode") dim j j= len(parentnode) - len(replace(parentnode,"_","")) dim nSpace for i=0 to j - 1 nSpace = nSpace + " " next i=0 do until adoRecordset.eof shtml = shtml _ & "<div id='" & parentnode & "_" & i + 1 & "'>" & nSpace _ & "<a href='#'" if adoRecordset.Fields.item("Children").value >0 then shtml = shtml & " onClick='ExpandNode(" & parentnode & "_" & i + 1 & "," & adoRecordset.Fields.item("id").value & ")'>+" else shtml = shtml & ">-" end if shtml = shtml & "</a>/n" & "<a href='#'" if adoRecordset.Fields.item("Children").value >0 then shtml = shtml & "onDblClick='ExpandNode(" & parentnode & "_" & i + 1 & "," & adoRecordset.Fields.item("id").value & ")'" end if shtml = shtml & ">" & adoRecordset.Fields.item("id").value & ": " & adoRecordset.Fields.item("remark").value & "</a></div>" if adoRecordset.Fields.item("Children").value >0 then shtml = shtml & "<div id='" & parentnode & "_" & i + 1 & "_0' style='display: none' loaded='no'>" & nSpace & " 正在加载 ...</div>" end if i=i+1 adoRecordset.MoveNext loop adoRecordset.close set adoRecordset = nothing adoConnection.close set adoConnection = nothing'response.write shtml%><script> var x = eval('parent.' + '<% =request.querystring("Pnode") & "_0"%>' ) ; x.innerHTML="<% =shtml %>";</script></BODY></HTML>
表结构:Tree(id,parentid,remark)