Блог

Я разрабатываю серверную часть веб-сайта, где пользователь может выбрать изображение, загруженное через FTP. Они могут создавать каталоги, которые они хотят, поэтому у меня есть рекурсивная функция PHP, которая получает мне всю информацию и создает список <ul /> и <li /> … но каталог на самом деле состоит из 2 ГБ изображений, так что, представьте, я не могу отобразить все это вместе. Мне нужно переключать / отключать <ul /> отображение каталогов.

Давайте рассмотрим пример структуры. Если у нас есть это:

 <ul>
    <li><a href="/file14">file14</a></li>
    <li><a href="/file15">file15</a></li>
    <li><a href="/file16">file16</a></li>
    <li class="dirname">
        <a href="/dirname1">dirname1/</a>

        <ul>
            <li class="dirname">
                <a href="/dirname1/Dirname2">Dirname2/</a>

                <ul>
                    <li class="dirname">
                        <a href="/dirname1/Dirname2/Dirname3">Dirname3/</a>

                        <ul>
                            <li><a href="/dirname1/Dirname2/Dirname3/file1">file1</a></li>
                            <li><a href="/dirname1/Dirname2/Dirname3/file2">file2</a></li>
                            <li><a href="/dirname1/Dirname2/Dirname3/file3">file3</a></li>
                        </ul>
                    </li>
                    <li><a href="/dirname1/Dirname2/file4">file4</a></li>
                    <li><a href="/dirname1/Dirname2/file5">file5</a></li>
                    <li><a href="/dirname1/Dirname2/file6">file6</a></li>
                    <li class="dirname">
                        <a href="/dirname1/Dirname2/dirname4">dirname4/</a>

                        <ul>
                            <li><a href="/dirname1/Dirname2/dirname4/file7">file7</a></li>
                            <li><a href="/dirname1/Dirname2/dirname4/file8">file8</a></li>
                        </ul>
                    </li>
                </ul>
            </li>
            <li><a href="/dirname1/file9">file9</a></li>
            <li><a href="/dirname1/file10">file10</a></li>
        </ul>
    </li>
    <li><a href="/file11">file11</a></li>
    <li><a href="/file12">file12</a></li>
    <li><a href="/file13">file13</a></li>
</ul>
  

Пользователь должен видеть, что:

 * file14
* file15
* file16
* dirname1/
* file11
* file12
* file13
  

Если они нажмут на dirname1 /, они увидят это:

 * file14
* file15
* file16
* dirname1/
    * Dirname2/
    * file9
    * file10
* file11
* file12
* file13
  

И если они нажмут на Dirname2 /, они увидят это:

 * file14
* file15
* file16
* dirname1/
    * Dirname2/
        * Dirname3/
        * file4
        * file5
        * file6
        * dirname/
    * file9
    * file10
* file11
* file12
* file13
  

Вы поняли идею, нет? Я привел различные примеры, потому что мой английский не в порядке, чтобы вы могли понять мою идею. В основном <li class="dirname"> будет «триггер», но я не могу не отображать все, только когда я нажимаю. Если мы нажимаем, когда отображается содержимое, то должно «отменить показ».

Другая вещь, которую я хочу сделать, это то, что <li /> который не имеет class="dirname" , получает свойство HREF <a /> , которое я сохраню на входе, чтобы обработать его при сохранении.

Хотелось бы, чтобы информации было достаточно, и заранее благодарю вас!

Я думаю, это то, что вам нужно? В принципе, он покажет любое, ul которое является дочерним под li.dirname после li.dirname нажатия. При повторном нажатии на него они будут скрыты.

 $(".dirname").click(
    function( e )
    {
        $("> ul", this).toggle();
        e.stopPropagation();
    }
);