Slidetoggle脚本does not toggle

问题描述：

我有一个切换幻灯片不起作用。花几个小时尝试/学习编辑和重写这个东西，但不知何故，可见和不可滑动的slidetoggle不工作。Slidetoggle脚本does not toggle

可能有人请帮助我的js脚本：SEE THE FIDDLE

JS：

$('.header .ullie').hide(); 

    $('.header h2 a').click(function() { 
    $(".header h2").not(this).next(".header .ullie").slideUp("slow"); 
    $(this).next(".header .ullie").slideToggle("slow"); 
    return false; 
}); 

$('.header h3 a').click(function() { 
    $(".header h3").not(this).next(".header .ullie").slideUp("slow"); 
    $(this).next(".header .ullie").slideToggle("slow"); 
    return false; 
});

HTML：

<div id="foldercontents"> 
<ul class="ullie"> 
<li class="header"> 
<h2><a href="javascript:void(0);">testbutton</a></h2> 
<ul class="ullie"> 
    <li class="foldercontent"> 
     <h3>title</h3> 
     <ul class="ullie"><li>row 1</li></ul> 
</li></ul> 
</li> 

<!-- second, duplicated from first --> 
<li class="header"> 
<h2><a href="javascript:void(0);">testbutton2</a></h2> 
<ul class="ullie"> 
    <li class="foldercontent"> 
     <h3>title</h3> 
     <ul class="ullie"><li>row 2</li></ul> 
</li></ul> 
</li> 

</ul> 
</div>

SEE THE FIDDLE *新增jQuery库

添加jQuery到小提琴，请看看和帮助，你可以将它们应用到标题本身 – Ruud

答

我假设你正在寻找something like this

$('ul li ul').hide(); 

$('.header > * > a, .foldercontent > * > a').click(function() { 
    $(this).parent().siblings().slideToggle("slow"); 
});

你也可以使用margin:0; padding:0;防止跳跃，而不是overflow:hidden，但是这取决于你

还要注意的是，你不需要<a>标签，如果你想

Slidetoggle脚本does not toggle

相关推荐