我正在尝试学习 JQuery 并且在理解该过程时遇到了一些困难。我阅读了几篇文章，也许是我对 javascript 的理解不足是障碍，但我想学习。我的目标是将 Accordion UI 用于菜单系统；让主菜单项 (#sidebar ul.accordion li a .opener .selected ) 也可用作链接，而不仅仅是子菜单 (div.slide ul li a) 的“开启器”。我在下面列出了 HTML、CSS 和 JQuery 脚本，并认为我的问题如下：
问：我的问题是在 JQuery 'header: "opener"' 或 'event: "click"' 还是需要 'click(function(){ })' ？
任何帮助（教育）将不胜感激。
我有以下 HTML 菜单结构...
<div id="sidebar">
<ul class="accordian">
<li>
<a href="./mainpagelink.php" class="opener">linkname</a>
<div class="slide">
<ul>
<li><a href="subpagelink.php">sublinkname</a></li>
...
</ul>
</div>
</li>
...
</ul>
...
</div>
我有以下CSS ...
#sidebar {
width:210px;
float:left;
padding-top:18px;
}
#sidebar .accordion {
margin:0 0 12px;
padding:0;
list-style:none;
font-size:1.2em;/* 1.1 em */
}
#sidebar .accordion li {
border-bottom:1px solid #009;
padding:7px 0 7px 11px;
}
#sidebar .accordion a {outline-style:none;}
#sidebar .accordion a:hover {
color:#9fa714;
text-decoration:none;
}
#sidebar .accordion .ui-state-active {
display:block;
background:url(../images/arrow-rt.gif) 100% 5px no-repeat;
margin-right:11px;
color:#9fa714;
text-decoration:none;
}
#sidebar .slide {padding:1px 0 0 28px;}
#sidebar .slide ul {
margin:0;
padding:0;
list-style:none;
}
#sidebar .slide ul li {
border:0;
padding:4px 0 2px;
}
#sidebar .slide ul li.active a,
#sidebar .slide ul a:hover {
background:none;
color:#9fa714;
}
我有以下 jquery 脚本...
$(document).ready(function(){
$('ul.accordion').accordion({
active: ".selected",
autoHeight: false,
header: ".opener",
collapsible: true,
event: "click"
});