0

Greetings, I would like to toggle a huge multi-level ul with mootools 1.1 or plain javascript. The list looks like: HTML:

 <ul>
    <li>aaa</li>
    <li>bbb</li>
    <li>ccc</li>
    <li>
        <ul>
            <li>ddd
                <ul>
                    <li>fff</li>    
                    <li>ggg</li>
                </ul>
            </li>
            <li>eee</li>
        </ul>
    </li>
 </ul>

What I would like to do initially is to show the first level expanded, and the other levels collapsed and when each of the list items is clicked, to expand the ul below it.

Is it possible to do it without (greatly) modifying the html above? From the documentation, I see that Fx.Slide is the most appropriate, however it accepts the id of the element as a parameter, which means I have to assign id's to each list item. Is there a way by using selectors of collections of elements starting from the top?

4

1 回答 1

0

我不确定为什么我会说适用于非常旧的 1.1 版本。但是,至少从 1.2 开始,您需要传递的元素要么是 ID(如您所说),要么是实际元素。

如果您可以使用 1.1 以外的其他版本,请尝试 1.3,它可以更轻松地选择您想要的元素。

在这里,我相信您需要每个<ul>直接<li>作为父元素的元素。MooTools 1.3 具有这个新的选择器引擎 Slick,它可以很容易地完成它:ul !> li.

但是,我不确定(我没有成功)直接子选择器在 1.1 中是否正常工作。

这是我想出的:http: //jsfiddle.net/rCfwq/

于 2010-12-14T00:06:10.483 回答