javascript - 单击时切换列表项

Question

我正在尝试构建一个列表，当单击 dt 时，会出现相应的 dd，当他们重新单击该 dt 时，dd 会向上滑动。

第一个 dd 始终保留，除非用户单击它。

问题是，当用户单击 dt 时，所有 dd 都会出现。

Fiddle demo here

Answer 1

尝试在点击的dt上使用.nextUntil，如下所示，

(function () {
    var dd = $('dd');
    dd.filter(':lt(3)').addClass('show'); //add show to first 3
    dd.filter(':nth-child(n+6)').addClass('hide'); //add hide to rest

    $('dt').on('click', function () {
        $(this).nextUntil('dt').toggleClass('show hide');
    })

})();

演示: http://fiddle.jshell.net/2MrxM/