javascript - 如何使用 slideToogle 方法 jquery 扩展列表

Question

我有 3 个不同的标题，它们也是打开 3 个 ul 列表的链接，请查看下面的 html。

单击其中一个标题后，我想一个一个地扩展我的列表之一，而不是全部，我使用每种方法和这一行制作了一个小循环

$('h2.show-list'+$(this).attr('class')).slideToggle();

任何想法都是以错误的方式写的，可能我犯了一个小错误任何帮助感谢

$('h2.show-list').each(function(i){
    $(this).addClass('gh'+i);
});

$('ul.categories').each(function(i){
    $(this).addClass('gh'+i);
});

$('h2.show-list').on('click',function(){            
    $('h2.show-list'+$(this).attr('class')).slideToggle();
    //$("div."+$(this).attr("class")).toggle("fast");
});

请在这里找到 fiddle :DEMO

Answer 1

您已经非常接近您所拥有的，您的脚本中的类选择器有错字，您缺少 show-litstS 中的 s。这是一个使代码非常简单的解决方案。它只是从单击的标题中搜索列表的下一次出现，并显示它。

$('h2').click(function(){
    $(this).next('ul').slideToggle(1000);
});

和here's an update到你的 fiddle 。