<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>jQueryMenul.html(菜单案例)</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<link rel="stylesheet" type="text/css" href="css/menu.css" />
<script type="text/javascript" src="jslib/jquery.js"></script>
<script type="text/javascript" src="jslib/jquerymenu.js"></script>
</head>
<body>
<ul>
<a href="#">我是主菜单1</a>
<li><a href="#" id="JqueryWindow.html">我是子菜单1</a></li>
<li><a href="#" id="JqueryWindow.html">我是子菜单2</a></li>
</ul>
<ul>
<a href="#">我是主菜单2</a>
<li><a href="#">我是子菜单3</a></li>
<li><a href="#">我是子菜单4</a></li>
</ul>
<div id="content"></div>
</body>
</html>
--js代码
$(document).ready(
function (){
//找到所有的主菜单
var as=$("ul > a");
//给主菜单注册onclick事件
as.click(
function (){
var asNode=$(this);
var ass=asNode.nextAll("li");
ass.toggle("slow");
}
);
$("li > a").click(
function (){
$("#content").load($(this).attr("id"));
}
);
}
);