jquery.js放在自己写的js之前
HTML
<ul>
<a href="#">我是菜单1</a>
<li><a herf="#" id="外部页面">我是子菜单1</a></li>
<li><a herf="#" id="外部页面">我是子菜单2</a></li>
</ul>
<ul>
<a href="#">我是菜单2</a>
<li><a href="#">我是子菜单3</a></li>
<li><a href="#">我是子菜单4</a></li>
</ul>
CSS
li{
/*去掉li的小圆点*/
list-style:none;
/*内容缩进*/
margin-left:18px;
/*子菜单隐藏*/
display:none;
/*让链接不显示下划线*/
text_decoration:none;
}
JS
//当注册的时候装载方法
$(document).ready(function(){
//给所有的主菜单注册点击事件
var as=${"ul>a"};
as.click(function(){
//获取当前被点击的a节点
var aNode = ${this};
//找到当前ul节点的所有的兄弟li节点
var lis = aNode.nextAll("li");
//让字节点显示或隐藏
lis.toggle("show");
})
//li下的被点击后加载id中的外面页面
${"li>a"}.click(function(){
$("#content").load.($(this).attr("id");)
})
})