Question

下拉列表会立即打开所有内部uls。当点击与ul相关的li时，我想逐个打开它们。

使用Javascript：

$(".first-stage").click(function(e) {
    var $nextItem = $('ul', this);
    var $i = $('i', this);
    $nextItem.slideToggle(function() {
        $i.toggleClass('fa-chevron-down fa-chevron-up');
    });
});

这是我的小提琴：http://jsfiddle.net/3BeGV/3/

Answer 1

我更改了你的标记，因此更容易理解，这就是我要做的：

http://jsfiddle.net/3BeGV/6/

<强> HTML

<ul class="main">
    <li>level 1
        <ul class="inner">
            <li>Level 2
                <ul class="inner">
                    <li>Level 3</li>
                </ul>
            </li>
            <li>Level 2
                <ul class="inner">
                    <li>Level 3</li>
                </ul>
            </li>
            <li>Level 2
                <ul class="inner">
                    <li>Level 3</li>
                </ul>
            </li>
        </ul>
    </li>

</ul>

<强>的jQuery

$('.main li').on('click',function(e) {
      var target = $( e.target );
       target.children().toggle();
});

$('.inner li').on('click',function(e) {
      var target = $( e.target );
       target.children().toggle();
});

<强> CSS

.inner {
    display:none;
}

下拉列表显示ul ul

1 个答案: