<div id="firstDiv">
<div id="secondDiv">
<ul id="accordionMenu">
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a>
<ul>
<li><a href="#">suboption 1</a></li>
<li><a href="#">suboption 2</a></li>
</ul>
</li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
</ul>
</div>
</div>
如何使其可扩展?
我有以下JavaScript代码:
$(document).ready(function() {
// Collapse everything but the first menu:
$("#accordionMenu > li > a").not(":first").find("+ ul").slideUp(1);
// Expand or collapse:
$("#accordionMenu > li > a").click(function() {
$(this).find("+ ul").slideToggle("fast");
});
});
最佳答案
@Yoshi:谢谢。我将在此处添加答案,希望对其他人有帮助
的HTML
<div id="firstDiv">
<div id="secondDiv">
<ul id="accordionMenu">
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a>
<ul>
<li><a href="#">suboption 1</a></li>
<li><a href="#">suboption 2</a></li>
</ul>
</li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
<li><a href="#">menu item</a></li>
</ul>
</div>
</div>
jQuery的:
// Collapse everything but the first menu:
$("#accordionMenu > li > a").not(":first").find("+ ul").slideUp(1);
// Expand or collapse:
$("#accordionMenu > li > a").click(function() {
$(this).find("+ ul").slideToggle("fast");
});
不要忘了包括jQuery库:)
关于javascript - jQuery展开式菜单,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/11454382/