<!DOCTYPE html>
树形菜单
<br> *{<br> padding: 0px;<br> margin: 0px auto;<br> }<br> div{<br><br> margin: 20px 0px 0px 30px;<br> }<br> ul{<br> display: none;<br> padding: 10px 0px 0px 40px;<br> }<br> span{<br> font-size: 18px;<br> }<br> li{<br> font-size: 14px;<br> line-height: 28px;<br> }<br> .icon{<br> list-style-image: url(images/icon-top.gif)<br> }<br> .end{<br> list-style-image: url(images/icon-end.gif)<br> }<br>
<br> window.onload=function(){<br> var imgs=document.getElementsByTagName("img");<br> var uls=document.getElementsByTagName("ul");</p> <pre><code> for(var i=0;i<imgs.length;i++){ imgs[i].index=i; uls[i].index=i; imgs[i].onclick=function(){ if(uls[this.index].style.display=" "){ uls[this.index].style.display="block"; }else{ uls[this.index].style.display=" "; } } } } </script> </code></pre> <p></head><br> <body><br> <div><br> <img src="images/classfiy.jpg" alt=""><br> <span>分类讨论区</span><br> <ul class="icon"><br> <li class="front">BBS系统</li><br> <li>共建水木</li><br> <li>站务公告栏</li><br> <li>妆点水木</li><br> <li class="end">申请版主</li><br><br> </ul><br><br> </div></p> <pre><code><div> <img src="images/info.jpg" alt=""> <span>社会信息</span> <ul class="icon"> <li class="front">美容品与饰品代理</li> <li>考研资料市场</li> <li>商海纵横</li> <li>动物保护者</li> <li>动物世界</li> <li class="end">中国风·神州各地</li> </ul> </div> <div> <img src="images/entertain.jpg" alt=""> <span>休闲娱乐</span> <ul class="icon"> <li class="front">射击类游戏</li> <li>动作类游戏</li> <li>益智类小游戏</li> <li>恐怖游戏</li> <li class="end">单机游戏</li> </ul> </div> <div> <img src="images/tech.jpg" alt=""> <span>电脑技术</span> <ul class="icon"> <li class="front">C</li> <li>C++</li> <li>C#</li> <li>JAVA</li> <li>javascript</li> <li class="end">oracle</li> </ul> </div> </code></pre> <p></body><br> </html></p>
首先,这段代码无法看,可能是提问的时候格式错误了,提问是如果有代码应该用代码特殊符号包裹起来。
其次,display 的 隐藏和显示,对应用 jquery 的方法
$("#id").hide();
$(#id").show()
虽然没有看你的代码,但是可分享你我的做法
if($("#id").is(":hidden")){
$("#id").show(); //如果元素为隐藏,则将它显现
}else{
$("#id").hide(); //如果元素为显现,则将其隐藏
}