Блог

Главная - Вопросы по программированию - Отображение / управление списком файлов / каталогов в Javascript?

Отображение / управление списком файлов / каталогов в Javascript?

#javascript #jquery #algorithm #oop #list

#javascript #jquery #алгоритм #ооп #Список

Вопрос:

Я ищу способ показать список каталогов и файлов в них с помощью javascript. Структура, которую я хочу, это:

  • Каталог 1

    • Файл 1
      • Путь
      • Предпринятое действие (удалено, добавлено, изменено)
    • Файл 2
      • Путь
      • Предпринятое действие (удалено, добавлено, изменено)

  • Каталог 2

    • Файл 1
      • Путь
      • Предпринятое действие (удалено, добавлено, изменено)
    • Файл 2
      • Путь
      • Предпринятое действие (удалено, добавлено, изменено)
    • Подкаталог 1
      • Файл подкаталога 1
        • Путь
        • Предпринятое действие (удалено, добавлено, изменено)
      • Файл подкаталога 2
        • Путь
        • Предпринятое действие (удалено, добавлено, изменено)

и т.д. То, что я ищу, это:

1) Как выполнить цикл по всем элементам, которые у меня есть.

2) Как отобразить их в виде дерева.

3) Как легко получить список всех дочерних элементов родительского элемента для выбора / отмены выбора. (Например, если пользователь нажимает на имя ‘Directory 1’, то все дочерние элементы этого каталога (файлы, подкаталоги, файлы подкаталогов и т.д.) Будут иметь флажок рядом с ними, Выбранный / невыбранный.

Есть идеи? Спасибо.

Ответ №1:

Мне еще предстоит найти хорошую реализацию дерева js.

jsTree достаточно силен, чтобы создать на его основе желаемую функциональность, хотя я нахожу его очень неинтуитивным и сложным в использовании и настройке. Существует достаточно активная доска объявлений, которая может помочь. Автор обещал переписать около года и опубликовал, что скоро появятся коммиты, хотя, если вы посмотрите на историю доски объявлений, он говорил об этом как минимум 6 месяцев.

Я не нашел ничего лучше, чем jsTree, и мне это не очень нравится, поэтому я желаю вам удачи.

Я думаю, что виджет дерева находится в списке желаний для jqueryui, но не задерживайте дыхание. Это должно быть репозиторием, я думаю.

И есть это. Понятия не имею, подходит ли это, просто нашел это, когда искал ссылки jqueryui. (Похоже, коммитов не было с 2009 года, вероятно, не лучшая идея использовать его тогда …)

Если вы нашли что-то интересное, пожалуйста, опубликуйте это.

Комментарии:

1. Я ничего не нашел, заканчиваю писать свой собственный. Я не искал древовидный объект javascript как таковой, скорее мне нужны были идеи о том, какой алгоритм использовать для поддержания их в древовидном списке, получения всех файлов / каталогов в родительском каталоге и т.д..

2. @Click, для реализации дерева в памяти нет специальных алгоритмов, которые вам нужно знать — пока вы знакомы с базовым обходом дерева и объектами в js, вы должны быть в состоянии создать требуемый тип узла с минимальными усилиями и всеми базовыми функциональными возможностями

3. Это правда, однако проблема здесь в том, что каждый узел может быть либо массивом: directory, содержащим вложенные каталоги / файлы каталога, либо объектом directory, указывающим, что сам каталог был изменен, т. е. добавлен или удален. Возможно, мне нужно как-то реорганизовать его, чтобы всегда использовать объект, однако это создает проблему с тем, как перебирать файлы / вложенные каталоги каталога..

4. @Click, не вижу проблемы, у вас есть два типа, File и Directory, у каждого из которых есть родительский указатель и флаг действия. Кроме того, у каталога есть дочерние элементы в массиве. Элементы массива сами по себе могут быть каталогами или файлами. Когда вы добавляете / удаляете / изменяете какой-либо элемент, вы помечаете его соответствующим образом и по мере продвижения следуете родительским указателям вплоть до корневого с пометкой «изменено». В чем проблема?

5. Вы правы.. спасибо .. сложно объяснить, что я делал, но ваш подход намного проще, поэтому я воспользуюсь этим. Спасибо 🙂