樹形菜單js代碼

樹形菜單js代碼

<style type="text/css">
<!--
h1 {
font-size:14px;
font-weight: normal;
}
.auto_init {
font-size: 12px;
margin:20px 0;
width:140px;
border: 1px dashed #CCCCCC;
padding:10px;
}
.auto_init li {
list-style-type: none;
}
-->
</style>
<script language="javascript" type="text/javascript">
//div+css+js實現自動合併樹形菜單js代碼
function auto_init(id,no,n){
if(document.getElementById(id+'_'+no).style.display == 'none'){ //如果此層是隱藏的 顯示此層
for(a=0;a<n;a++){
   document.getElementById(id+'_'+a).style.display = 'none';
}
document.getElementById(id+'_'+no).style.display = 'block';
}else{
document.getElementById(id+'_'+no).style.display = 'none'; //如果此層是顯示的 隱藏此層
}
}
</script>
<div class="auto_init">
<h1><a href="#Menu=auto_init('dis',0,4);" |- 樹形菜單</a></h1>
<ul id="dis_0" style="display:none;">
<li>|- js樹形菜單</li>
<li>|- js樹形菜單</li>
<li>|- js樹形菜單</li>
</ul>
<h1 |- 樹形菜單</h1>
<ul id="dis_1" style="display:none;">
<li>|- js樹形菜單</li>
<li>|- js樹形菜單</li>
<li>|- js樹形菜單</li>
<li>|- js樹形菜單</li>
</ul>
<h1 |- 樹形菜單</h1>
<ul id="dis_2" style="display:none;">
<li>|- js樹形菜單</li>
<li>|- js樹形菜單</li>
</ul>
<h1 |- 樹形菜單</h1>
<ul id="dis_3">
<li>|- js樹形菜單</li>
<li>|- js樹形菜單</li>
</ul>
</div>