Question

我需要一些jQuery来使嵌套的ul列表菜单在单击

时折叠和解除折叠

<ul>
    <li><a href "#">Hello World</a>

        <ul>
            <li><a href "#">Hello World</a>
            </li>
            <li><a href "#">Hello World</a>

                <ul>
                    <li><a href "#">Hello World</a>
                    </li>
                    <li><a href "#">Hello World</a>
                    </li>
                </ul>
            </li>
            <li><a href "#">Hello World</a>
            </li>
        </ul>
    </li>
    <li><a href "#">Hello World</a>
    </li>
    <li><a href "#">Hello World</a>
    </li>
    <li><a href "#">Hello World</a>
    </li>
</ul>

Answer 1

试试这个让你真正崩溃的崩溃效果：

$('li a').click(function (e) {
    e.preventDefault();
    var ullist = $(this).parent().children('ul:first');
    ullist.slideToggle();
});

JSFIDDLE DEMO

Answer 2

这个jQuery可以解决问题：

$('li a').click(function (e) {
    e.preventDefault();
    var ullist = $(this).parent().children('ul:first');
    ullist.toggle('slow');
    //if(ullist.is(':visible')){
    //    ullist.hide('slow');
    //} else {
    //    ullist.show('slow');
    //}
});

see this link on jsfiddle

如何创建一个简单的jQuery嵌套ul列表菜单

2 个答案: