Я хочу динамически отображать все изображения из каталога с помощью javascript. Как я могу это сделать?
Я не думаю, что это возможно, но если вы сделаете запрос AJAX на страницу ASP.NET или PHP (или аналогичную), они могут перечислить файлы в папке и вернуть их для показа Javascript.
Очевидно, что применяется междоменная политика.
Если вы используете PHP, вы должны использовать рекурсию в каталогах, чтобы получить полную файловую структуру. В PHP есть функция каталогов сканирования, которую вы можете использовать.
Пример базового кода:
function listdir($folder) { if (!is_dir($folder)) { return array(); //empty if not a folder } $return = scandir($folder); $subfolders = array(); array_shift($return); //first two values are always .. & . array_shift($return); foreach ($return as $key => $value) { if (is_dir($value)) { unset($return[$key]); $subfolders[$value] = listdir($value); //recursively analyse the subdirectory } } return array_merge(array_values($return), $subfolders); } Примечание. Это не было протестировано, пожалуйста, сообщите мне, если он не работает.
базовый пример php
<?php foreach(glob("/path/to/images/{*.gif,*.jpg,*.png,*.jpeg,*.bmp}", GLOB_BRACE) as $image){ echo '<img src="'.$image.'">; } ?>
Выполнение этого с использованием чисто javascript невозможно, если только каталог не имеет индексов или вы не знаете имена файлов заранее. Еще одна альтернатива, использующая php, такова:
Отправить запрос ajax в php-файл с данными в качестве имени каталога
Затем файл PHP opendir доступ к содержимому каталога с помощью opendir , readdir , scandir т. Д. См. Этот вопрос SO или эту ссылку для получения дополнительной информации о чтении каталога с помощью команд php readdir / scandir или этого (по glob)
Файл PHP возвращает имена файлов (здесь имена изображений) как объект json.
На стороне клиента ответ ajax приходит как объект json.
Готово! У вас есть все изображения в этой папке.
Вы забыли ' в конце тега эха:
<?php foreach(glob("/path/to/images/{*.gif,*.jpg,*.png,*.jpeg,*.bmp}", GLOB_BRACE) as $image){ echo '<img src="'.$image.'">'; } ?>