首先声明,我不懂ASP,充其量只会改而已,各位高手拍砖手下留情。因为要实现一个如下面需求的左侧树形菜单:
产品1
产品2
产品3
当点击“产品1”时,页面跳转到产品1类目下的所有产品列表页面,左侧树形菜单自动显示当前大类“产品1”下的小类,此时只有“产品1”下级目录是展开的,其他大类节点都是闭合的,显示如下:
产品1
产品1-1
产品1-2
产品2
产品3
我在CSDN论坛也看到了有搞ASP的朋友问类似这个问题,但似乎没人解决(可能高手懒的回答),正好手头有个树形菜单的源码,决定对其进行改造。
基本思路是:一次读出所有的大类及其小类,然后用样式控制所有小类不显示,之后再利用传递过来的大类变量,触发符合条件的小类菜单显示出来。OK,开工!
假设菜单页为left.asp,产品页为product.asp
left.asp源码如下:
< %
sql = " select * from class1 order by Class1Id asc " ' 读出大类
set sortRootRs = conn.execute (sql)
i = 0
do while not (sortRootRs.eof or err)
sortRootRsID = sortRootRs( " class1id " )
% >
< tr >
< td height = " 18 " align = " left " valign = " top " background = " images/pole_1.jpg " >< div style = " padding-left:12px; padding-top:0px " >
< a href = " products.asp?class1id=<%=sortRootRs( " class1id " )%> " >< span class = " style6 " > < % = sortRootRs( " class1name " )% ></ span ></ a > ' 显示大类列表
</ div ></ td >
</ tr >
< tr id = child < % = sortRootRsID% > style = ' display:none'>'小类列表用样式控制它默认不显示
< td height = " 18 " align = " left " valign = " top " background = " images/pole_2.jpg " >
< %
sql = " select * from class2 where class1ID= " & sortRootRs( " class1id " ) & " order by Class2Id asc " ' 读出小类
set sortChildRs = server.createObject( " adodb.recordset " )
sortChildRs.open sql,conn, 1 , 1
j = 1
' k=sortchildRs.recordcount
do while not (sortChildRs.eof or err)
% >
< div style = " padding-left:12px; padding-top:0px;line-height:18px; " >
< a href = " products.asp?class1id=<%=sortRootRs( " class1id " )%>&class2id=<%=sortChildRs( " class2id " )%> " class = " style7 " style = " text-decoration:none " >< % = sortChildRs( " class2name " )% ></ a >
</ div >
< %j = j + 1
' if j>100 then exit do
sortChildRs.moveNext
loop % > ' 小类循环
</ td >
</ tr >
< %
i = i + 1
if i > 100 then exit do
sortRootRs.moveNext
loop
% > ' 大类循环
</ table >
这里要注意的就是这段:
小类列表的循环表格有一个id,并且要用样式默认它不显示。
然后就是product.asp,为了简单,我就不写出产品的列表部分,只把该页调用left.asp相关的语句写出来:
< ! --
function window_onload(i){
childSort = document.all( " child " + i);
// theTd = document.all( " td " + i);
if (childSort.style.display == " none " ){
// theTd.bgcolor = " #ffffff " ;
childSort.style.display = "" ;}
else {
// theTd.bgcolor = " #000000 " ;
childSort.style.display = " none " ;}
}
//-->
</ script >
< html >
< body onload = " window_onload(<%=class1id%>) " >
< ! -- #include file = " left.asp " -->
</ body >
</ html >
这里的function因为要被动触发,我上网找了好久才找到用window_onload的方法在进入页面的时候就可以触发(原始代码是使用onclick事件来触发打开下级目录,从而实现点击大类节点即展开其下级目录,同时可展开多个下级目录,但这和我们要实现的效果不符。我就是从这里想到的,不使用主动触发的方式,根据传递到页面的大类变量来被动触发,不就可以实现只打开当前大类节点的下级目录了么)
效果如下:
连我这个ASP门外汉都能搞定,大家做ASP肯定一看就明白了,如果大家有更优化更简单的办法也希望告诉我,这种方法在数据量不大的情况下还过得去,数据量很大估计就不行了。呵呵,希望能帮到各位!