<script type="text/javascript">
function nodeClick(o){
var obj, disp, level, nsb
obj = event.srcElement;
if (obj != o){
if(obj.nextSibling != null){
if (obj.nextSibling){
disp = obj.nextSibling.style.display != "none" ? "none" : "block";
level = parseInt(obj.name.substring(1));
while (obj.nextSibling && parseInt((obj.nextSibling.name == null ? -1 : obj.nextSibling.name.substring(1))) > level) {
obj = obj.nextSibling;
obj.style.display = disp;
}
}
}
}
}
</script>
Html代碼
<div id="tree" style="width:300px;height:450px;border:1px outset #EEEEEE;padding-top:2px;overflow-x:hidden;overflow-y:scroll;display:inline" onmouseover="javascript:var obj=event.srcElement;if(obj!=this)obj.style.backgroundColor='#f3f6ff';" onmouseout="javascript:var obj=event.srcElement;if(obj!=this)obj.style.backgroundColor='';" onclick="javascript:nodeClick(this)">
<div name="l1">
請選擇部門
</div>
<div name="l2">
申銀萬國
</div>
<div name="l3">
經紀管理總部
</div>
<div name="l4">
上海餘姚國債
</div>
<div name="l4">
上海新昌路證券營業部
</div>
<div name="l4">
上海莘莊證券營業部
</div>
<div name="l4">
上海中華路證券營業部
</div>
<div name="l4">
上海瞿溪路營業部
</div>
<div name="l4">
上海東體育會路營業部
</div>
<div name="l4">
上海奉賢證券營業部
</div>
<div name="l4">
上海福州路證券營業部
</div>
<div name="l4">
上海餘姚路證券營業部
</div>
<div name="l4">
上海虹古路證券營業部
</div>
<div name="l4">
上海龍茗路證券營業部
</div>
<div name="l4">
上海金山證券營業部
</div>
<div name="l4">
上海洛川東路營業部
</div>
<div name="l3">
銀證通部門
</div>
<div name="l4">
銀證通結算機構
</div>
<div name="l3">
經紀管理總部
</div>
</div>
注:HTML代碼中 div可換成其他標籤,本人測試a、h1混用也可以。name可換成其他 如class 然後方法需調整爲.className。只要記得將菜單放到id="tree"的div中就行。
IE通過