<style type="text/css">
a{text-decoration:none;}
li{list-style-type:none;}
</style>
<script type="text/javascript" src="../jquery-1.7.2.js"></script>
<script type="text/javascript">
$(function(){
$('.level1 > a').click(function(){
$(this).addClass('current')
.next().show()
.parent().siblings().children('a').removeClass('current')
.next().hide();
});
});
</script>
<div>
<ul class="menu">
<li class="level1">
<a href="#">手机</a>
<ul class="level2">
<li><a href="#">智能手机</a></li>
<li><a href="#">音乐手机</a></li>
<li><a href="#">拍照手机</a></li>
</uL>
</li>
<li class="level1">
<a href="#">电脑</a>
<ul class="level2">
<li><a href="#">平板</a></li>
<li><a href="#">笔记本</a></li>
<li><a href="#">超级本</a></li>
</uL>
</li>
<li class="level1">
<a href="#">编程语言</a>
<ul class="level2">
<li><a href="#">php</a></li>
<li><a href="#">java</a></li>
<li><a href="#">.net</a></li>
</uL>
</li>
</ul>
</div>