Fiddle DEMO
更改的标记
加入ul
代替li
作为ul
不能直接包含ul
<div id="menu">
<ul>
<li><a href="#">Menu Item 1</a>
<ul id="submenu"> <!-- added ul instead of li -->
<li><a href="#">Submenu Item 1</a>
</li>
<li><a href="#">Submenu Item 2</a>
</li>
</ul>
</li>
<li><a href="#">Menu Item 2</a>
</li>
<li><a href="#">Menu Item 3</a>
</li>
</ul>
</div>
<div id="right">
<button type="button" id="button">Menu</button>
</div>
个
JS
$('#menu li:has("ul")').children('ul').hide(); //hide submenu
$('#button').toggle(
function() {
$('#right').animate({
left: 150
});
},
function() {
$('#right').animate({
left: 0
});
});
$('#menu li:has("ul")').click(function(){
$(this).children('ul').slideToggle(); //toggle submenu
});
参考
.slideToggle()
:has()
这不是有效的标记。您不能将'ul'作为另一个'ul'的孩子。 – ahren
至少这个[page](http://csswizardry.com/demos/css-dropdown/)已通过W3C验证 – Robert002