Вывод каталога в виде дерева на js
Добрый день, подскажите пожалуйста, возможно ли на js вывести все папки и файлы определенного каталога в виде дерева в раскрывающемся списке на сайт. Например обычное дерево каталогов windows:
![]() Я вижу 3 варианта решения проблемы, но ни один не знаю как реализовать:
Сейчас есть только скрипт вывода дерева от treeview.net: ![]() |
так как задача полезна, возможно уже существуют готовые плагины, на которые я бы также взглянул, дабы не изобретать велосипед
а так нужно делать на php обход каталога и его подкаталогов (например, на основе использования функции scandir) и прикручивать вывод к какому-нибудь js-дереву (в твоём случае ещё и учитывать особенности wordpress) можно погуглить на тему php-js файловых менеждеров |
|
для затравки
define("SEP", "· ");
$dir = ".";
echo $dir."<br/>";
function recursive_directory_traversal($dir, $sep) {
$files = array_diff(scandir($dir), array(".", ".."));
foreach($files as $value) {
if (empty($files)) continue;
$path = $dir."/".$value;
if (is_dir($path)) {
echo $sep."<b>".$value."</b><br/>";
recursive_directory_traversal($path, $sep.SEP);
} else {
echo $sep.$value."<br/>";
}
}
}
recursive_directory_traversal($dir, SEP);
|
bes,
if (empty($files)) continue;лишнее |
Цитата:
попутно проба пера использования с http://www.jstree.com/
<meta charset="utf-8">
<link rel="stylesheet" href="dist/themes/default/style.min.css" />
<script src="dist/libs/jquery.js"></script>
<script src="dist/jstree.min.js"></script>
<div id="jstree">
<?php
$dir = ".";
function recursive_directory_traversal($dir) {
echo "<ul>";
$files = array_diff(scandir($dir), array(".", ".."));
foreach($files as $value) {
$path = $dir."/".$value;
$value = iconv("windows-1251", "utf-8", $value);//
if (is_dir($path)) {
echo "<li>".$value;
recursive_directory_traversal($path);
echo "</li>";
} else {
echo "<li data-jstree='{\"icon\":\"http://jstree.com/tree.png\"}'>".$value."</li>";
}
}
echo "</ul>";
}
recursive_directory_traversal($dir);
?>
</div>
<script>
$(function(){
$('#jstree').jstree();
});
</script>
|
если потребуются параметры размер, дата изменения, модификации и другие, то посоветовал посмотреть RecursiveDirectoryIterator
|
|
Цитата:
|
| Часовой пояс GMT +3, время: 20:40. |